2

我正在尝试创建一个带有 ID 标记的标记集群,因为我稍后想从地图中删除一个标记。但是,我什至无法让这些标记的标记出现在地图上。我正在从 geoJSON 格式的变量加载它们individualPoints。我可以使用以下代码片段直接将这些标记添加到地图中:

// create object to save markers
var markersID = {};

// exchanges latitude & longitude
function switchLatLong(oldLocation) {
  return new L.LatLng(oldLocation[1], oldLocation[0]);
}

var geoJsonLayer = L.geoJson(individualPoints, {
  onEachFeature: function(feature, layer) {
    /* can add directly to the map--this works */
    markersID[feature.properties.id] = 
        L.marker(switchLatLong(feature.geometry.coordinates))
            .addTo(map);
  }
});

但我希望它们在一个集群中,所以我认为我需要用一个 ID 标记每个标记(如在这个问题中),然后将该组添加到集群中,如下所示:

var geoJsonLayer = L.geoJson(individualPoints, {
  onEachFeature: function(feature, layer) {
    /* tag the marker with the id */
    markersID[feature.properties.id] = 
        L.marker(switchLatLong(feature.geometry.coordinates));
  }
});

// create a marker cluster group, and add the markers to this.
var markers = L.markerClusterGroup({});
/* here's where I'm trying to toggle to use the markers with ID numbers */
//markers.addLayer(geoJsonLayer); // this works
markers.addLayers(markersID);   // this doesn't

添加geoJsonLayer工作正常,但添加markersID没有。所以我一定是添加markersID不正确。这是一个jsfiddle。 https://jsfiddle.net/anfw0n6w/

问题:有没有更好的方法来创建具有我以后可以参考的 ID 的标记?我还能如何添加markersID到 markerClusterGroup?

4

1 回答 1

4

有没有更好的方法来创建具有我以后可以参考的 ID 的标记?

有一些可行的方法:-)

我还能如何添加markersID到 markerClusterGroup?

由于你markersID是一个普通的对象,你不能。addLayer接受标记或图层组(如您的L.geoJson),并addLayers接受标记数组

不要将稍后引用标记的需要与将它们添加到标记簇组的需要混为一谈。

发生的情况是,在您的onEachFeature中,您在 中复制您的标记(创建新的)markersID,而不是保留对由 .layer构建的相同的引用L.geoJson。如果您只保留对 的引用layer,那么您可以直接引用那些标记,并且您可以直接将您的L.geoJson图层组添加到您的标记集群组:

var markersID = {};

var geoJsonLayer = L.geoJson(individualPoints, {
  onEachFeature: function(feature, layer) {
    // make a marker with that number
    // actually no need to duplicate the marker.
    //markersID[feature.properties.id] = L.marker(switchLatLong(feature.geometry.coordinates));
    markersID[feature.properties.id] = layer;
  }
});

markers.addLayer(geoJsonLayer); // this works
map.addLayer(markers);

// This will work, you just need to get the appropriate `id`.
markers.removeLayer(markersID[id]);

演示:https ://jsfiddle.net/anfw0n6w/1/

于 2016-08-19T15:52:22.273 回答