集群 geojson 层不适用于标记过滤

Question

我正在使用一些 GeoJSON 数据制作 Leaflet 地图。

我尝试将集群功能添加到我的 JS 文件中。当我根据属性添加一些过滤器和样式功能时，我无法找到正确的方法来编写集群功能。

这是 GeoJSON 层和过滤器验证器：

const geojsonLayer = L.geoJSON(null,{
filter: (feature) => {
  const isYearChecked = checkboxStates.years.includes(feature.properties.year)
  const isEventTypeChecked = checkboxStates.eventTypes.includes(feature.properties.eventType)
  return isYearChecked && isEventTypeChecked }, //only true if both are true

使用音标函数：

              var year = feature.properties.year;
              if (year <= -150) {
                  return {
                      color: "black"
                  };

然后我添加弹出窗口：

layer.bindPopup(popupText, {
       closeButton: true,
       offset: L.point(0, -10)
          });
     layer.on('click', function() {
       layer.openPopup();
     });
   },
}).addTo(map);

我尝试添加这段代码来显示集群，但我不知道将它放在我的代码中的什么位置才能工作 (https://github.com/Leaflet/Leaflet.markercluster):

var markers = L.markerClusterGroup();
markers.addLayer(L.marker(getRandomLatLng(map)));
// ... Add more layers ...
map.addLayer(markers);

我的全部代码在这里可用：https://github.com/jandre3/pince-crochet

Answer 1

一旦你填充了 Leaflet GeoJSON 层组（通常使用 geojsonLayer.addData(geoJsonObject)，那么不要将该组添加到你的地图中，只需将它添加到你的 MarkerClusterGroup 中：

const mcg = L.markerClusterGroup().addTo(map);

geojsonLayer.addData(geoJsonObject).addTo(mcg);

如果以后你想交换内容，你可以从两个组中清除它并重复：

mcg.clearLayers();
geojsonLayer.clearLayers();

geojsonLayer.addData(geoJsonObject).addTo(mcg);

演示：https://jsfiddle.net/hd68ea7k/

集群 geojson 层不适用于标记过滤

Cluster geojson Layer doesn't work with marker filtering

javascript

leaflet

leaflet.markercluster