我正在撞墙,想知道为什么这种风格没有应用。这些点以默认样式呈现。
if ((Math.abs(prevCoord[0] - currCoord[0]) < 500) && (Math.abs(prevCoord[1] - currCoord[1]) < 500)) {
console.log("tortuous");
var tortySource = new ol.source.Vector(); // create an empty source instance
var tortyPoint = new ol.geom.Point(currCoord);
var tortyFeature = new ol.Feature({ // create a feature with the point geometry
geometry: tortyPoint,
style: new ol.style.Style({
fill: new ol.style.Fill({
color: 'rgba(255,0,0,0.5)'
})
})
});
tortySource.addFeature(tortyFeature); // add the feature to the source
var tortyLayer = new ol.layer.Vector({ // create a layer with that source
source: tortySource
});
map.addLayer(tortyLayer);
};
编辑当我尝试使用setStyle时,我这样做了。我的所有观点都消失了。
if ((Math.abs(prevCoord[0] - currCoord[0]) < 500) && (Math.abs(prevCoord[1] - currCoord[1]) < 500)) {
console.log("tortuous");
var tortySource = new ol.source.Vector(); // create an empty source instance
var tortyPoint = new ol.geom.Point(currCoord);
var tortyFeature = new ol.Feature({ // create a feature with the point geometry
geometry: tortyPoint
});
tortyFeature.setStyle(
new ol.style.Style({
fill: new ol.style.Fill({
color: [255, 0, 0, 0.5]
})
})
);
tortySource.addFeature(tortyFeature); // add the feature to the source
var tortyLayer = new ol.layer.Vector({ // create a layer with that source
source: tortySource
});
map.addLayer(tortyLayer);
};
答案 0 :(得分:2)
ol.Feature
没有样式属性。您无法在构造函数上设置样式。您应该使用ol.Feature#setStyle
。所以:
feature.setStyle(
new ol.style.Style({
image: new ol.style.Circle({
fill: new ol.style.Fill({ color: [255,0,0,1] }),
stroke: new ol.style.Stroke({ color: [0,0,0,1] }),
radius: 5
})
})
);
更好,将样式存储在变量中,这样OL就不会重新创建样式。
答案 1 :(得分:0)
很长一段时间我不是在OL3,而是在查看文档。
http://openlayers.org/en/v3.5.0/apidoc/ol.Feature.html
可以使用setStyle单独设置要素的样式;否则他们会使用矢量图层或要素叠加的样式。
因此,在创建“类实例”时将样式作为属性传递将无效。
如果您尝试首先创建该功能,那么该怎么办
tortyFeature.setStyle({
fill: new ol.style.Fill({
color: 'rgba(255,0,0,0.5)'
})
}
另请注意,对于文档,http://openlayers.org/en/v3.5.0/apidoc/ol.style.Style.html的保留仍然是实验性的,以及所有相关内容。
或尝试将样式添加到tortySource
。
这只是一种探索方式,我无法采取行动,这将100%有效。