Javascript 更改图层中单个矢量要素的图标

Javascript 更改图层中单个矢量要素的图标,javascript,icons,openlayers,Javascript,Icons,Openlayers,目前,我正在尝试更改用户关注的向量层的特定功能的图标。我将每个要素添加到地图中,如下所示: var point = new OpenLayers.Geometry.Point(pt.lon, pt.lat); var markerStyle = OpenLayers.Util.extend(OpenLayers.Feature.Vector.style['default'], { externalGraphic: iconURL }); var marker = new OpenLay

目前,我正在尝试更改用户关注的向量层的特定功能的图标。我将每个要素添加到地图中,如下所示:

var point = new OpenLayers.Geometry.Point(pt.lon, pt.lat);
var markerStyle = OpenLayers.Util.extend(OpenLayers.Feature.Vector.style['default'],  {
    externalGraphic: iconURL
});
var marker = new OpenLayers.Feature.Vector(point, attributes, markerStyle);
稍后,我将执行以下操作以更新功能的图标:

var marker = this.findSelectedMarker();
if (marker) {
    marker.style.externalGraphic = newIconUrl;
    this.layer.redraw();             
}
但是当图层重新绘制时,我图层中的所有特征都使用
newIconUrl
,而不仅仅是我试图更新的选定标记


如何更改图层中一个选定特征的图标?谢谢。

为了解决这个问题,我需要解决两个问题。第一个与使用多个OpenLayers样式有关,包括图层级别和单个要素级别。我删除了每个特征的样式,因此仅实现了以下图层样式:

this.layerStyle = new OpenLayers.StyleMap({ 
    'default': {
        externalGraphic: media_url + '${iconURL}',
        graphicHeight: 32,
        graphicWidth: 32,
        graphicXOffset: -16,
        graphicYOffset: -32,
        fillOpacity: 0.75
    }
});
我所做的第二个更改是使用属性替换语法,用名为
'${iconURL}'
的特性属性指定图标URL。这允许我通过简单地更改选定功能的属性并重新绘制图层来更改图标url:

focusedMarker.attributes.iconURL = this.focusedURL;
this.layer.redraw();