在openlayers中更改feature.vector的外观(changing the appearance of feature.vector in openlayers)

在openlayers中更改feature.vector的外观(changing the appearance of feature.vector in openlayers)

我正在将我的代码从使用标记图层转换到矢量图层。 我在地图上显示标记时遇到问题，作为Feature.Vector类（在我使用Feature类之前）。

具体来说，我无法弄清楚如何使用我选择的独特图像显示每个功能。 我已经看过一些如何使用样式图改变一般特征样式的例子，但我还没有看到直接设置特征图像的方法。

这似乎是一个简单的问题，但我还没有找到解决方案。 我目前正在尝试使用样式属性：

var feature = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(ll.lon, ll.lat), {externalGraphic: "http://www.openlayers.org/dev/img/marker.png"});

但是，这只会导致正常的默认图标（橙色圆圈）。

设置功能的data.icon并创建一个标记同样不起作用。

提前致谢！

I am transitioning my code from using a marker layer to a vector layer. I am having problems displaying markers on the map as a Feature.Vector class (before I used simply the Feature class).

Specifically, I cannot figure out how to display each feature with a distinct image that I choose. I've seen some examples of how to change the style of a feature in general using stylemaps, but I have not seen a way to directly set the image of a feature.

This seems to be a simple problem but I have not yet found the solution. I am currently trying to use a style property:

var feature = new OpenLayers.Feature.Vector(new OpenLayers.Geometry.Point(ll.lon, ll.lat), {externalGraphic: "http://www.openlayers.org/dev/img/marker.png"});

However, this just results in the normal default icon (an orange circle).

Setting data.icon of the feature and creating a marker equally does not work.

Thanks in advance!

最满意答案

您将占位符置于由特征属性填充的图层样式中。

var style = OpenLayers.Util.extend({
    externalGraphic : "${icon}",
    pointRadius     : 15
}, OpenLayers.Feature.Vector.style['default']);

var layer   = new OpenLayers.Layer.Vector("Simple Geometry", { style: style }),
    point   = new OpenLayers.Geometry.Point(ll.lon, ll.lat),
    feature = new OpenLayers.Feature.Vector(point, { icon: "icon.png" });

layer.addFeature(feature);
you put placeholders in the layer style which get populated by the features attributes.
 
var style = OpenLayers.Util.extend({
    externalGraphic : "${icon}",
    pointRadius     : 15
}, OpenLayers.Feature.Vector.style['default']);

var layer   = new OpenLayers.Layer.Vector("Simple Geometry", { style: style }),
    point   = new OpenLayers.Geometry.Point(ll.lon, ll.lat),
    feature = new OpenLayers.Feature.Vector(point, { icon: "icon.png" });

layer.addFeature(feature);