无法更改地图框中的标记图标/颜色

mhe*_*ers 5 javascript mapbox

我在这里操作 mapbox 标记半径示例:

https://www.mapbox.com/mapbox.js/example/v1.0.0/marker-radius-search/

尝试在随机点的特定半径内更改标记的颜色/图标,但尽管属性已注册为已更改,但颜色并未更改。这是我的代码:

clusterLayer = L.mapbox.featureLayer('examples.map-h61e8o8e').on('ready', function(e) {
    clusterGroup = new L.MarkerClusterGroup({
      showCoverageOnHover: false,
      animateAddingMarkers: true
    });

    e.target.eachLayer(function(layer) {
        clusterGroup.addLayer(layer);
        layerArray.push(layer);
    });
    map.addLayer(clusterGroup);
});

window.setTimeout(eventFunction,eventTiming);

function eventFunction(){
  clusterLayer.setFilter(affectMarker);
}

function affectMarker(feature) {
  var fLat = feature.geometry.coordinates[1];
  var fLng = feature.geometry.coordinates[0];
  var fPt = L.latLng(fLat,fLng);
  var dist = eventPt.distanceTo(fPt);
  if (dist < eventRadius){
    feature.properties['marker-color'] = eventColorNegative;
    feature.properties['marker-symbol'] = 'danger';
  }
}
Run Code Online (Sandbox Code Playgroud)

为什么这不起作用?我已经验证它正在返回有效积分。

另请注意,使用的标记是MakiMarkers

mhe*_*ers 2

我找到了两种方法来做到这一点,尽管我认为这两种方法都不如使用上面的代码来做到这一点那么理想。第一个是使用:而不是setFilter使用eachLayer

clusterLayer.eachLayer(affectMarker);

然后在循环中使用 setIcon:

layer.feature.properties['marker-color'] = eventColorNegative; layer.feature.properties['marker-symbol'] = 'danger'; layer.setIcon(L.mapbox.marker.icon(layer.feature.properties));

另一种方法是首先包含 MakiMarkers 扩展(我相信该扩展已被弃用并纳入 Mapbox):

https://github.com/jseppi/Leaflet.MakiMarkers

然后使用以下语法:

layer.setIcon(L.MakiMarkers.icon({icon: "danger", color: eventColorNegative}));