将 OverpassAPI 中的标记添加到 MarkerCluster

问题描述

我有一个像这样的 Overpass 查询：

/C:/Users/krist/Documents/tuts/firebase-functions/public/index.html

但是我如何从中获取数据并将其添加到 MarkerCLuster 中？

用法创建一个新的 MarkerClusterGroup 示例：

var opl = new L.OverPassLayer({
    query: "(node['amenity'='bench']({{bBox}});node['leisure'='picnic_table']({{bBox}}););out body;",markerIcon: iconn,});
map.addLayer(opl);

解决方法

只需将 OverPass 层添加到 MarkerClusterGroup：

const markers = L.markerClusterGroup();
markers.addLayer(opl);
map.addLayer(markers);

注意：如果 OverPass 图层包含非点（~非标记）子图层（例如区域要素的多边形），它们仍然会通过 MCG 出现在地图上，但后者不会将它们聚类（就像它那样）不知道使用哪个位置进行聚类）。

注意 2：如果 OverPass 层动态地向地图添加更多特征/层（通常如果它在视口 - 因此它的 bbox - 改变时执行新请求），上述简单方案确实不起作用。在这种情况下，您可能会对我的 Leaflet.MarkerCluster.LayerSupport subplugin 感兴趣：

Leaflet.markercluster 插件的子插件（简称 MCG）；带来与 L.Control.Layers 和其他 Leaflet 插件的兼容性。 IE。使用直接调用 map.addLayer 和 map.removeLayer 的所有内容。

就您而言，您应该可以这样使用它：

const mcgLayerSupportGroup = L.markerClusterGroup.layerSupport();
    
mcgLayerSupportGroup.addTo(map);
mcgLayerSupportGroup.checkIn(opl); // <= this is where the magic happens!

opl.addTo(map);