更改圖層中單個矢量要素的圖標

Question

目前，我正在嘗試更改用戶關注的矢量層的特定功能的圖標。 我將每個要素添加到地圖中，如下所示：

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使用newIconUrl ，而不僅僅是我要更新的選定標記。

如何更改圖層中一個選定要素的圖標？ 謝謝。

Answer 1

為了解決此問題，我需要解決兩個問題。 第一個與在圖層級別以及單個要素級別使用多種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();