javascript - 传单控件不过滤标记

Question

我正在尝试在我的传单 map 中与标记聚类器一起实现“过滤”功能，我已经拥有控制框并绘制了标记，但是在取消勾选“类别”后，我在 map 上没有任何更新附上此功能正在运行的示例 http://jsfiddle.net/RogerHN/31v2afte/2/

这就是我绘制标记的方式。

    case 'antisocialbehaviour':
    marker = L.marker(new L.LatLng(a[0], a[1]), {
                icon: icons,
                title: 'antisocialbehaviour'
            });
            markers_cluster.addLayer(marker); 
            break;

控制框所需的代码(JavaScript 顶部)

var groupA = L.layerGroup(markersA);
var groupB = L.layerGroup(markersB);
var markersA = [];
var markersB = [];
var overlayMaps = {
    "A": groupA,
    "B": groupB
};
L.control.layers(tileLayer, overlayMaps, {position:'topleft'}).addTo(map);

如果有人需要查看问题，我在 JSFiddle 上的代码。 https://jsfiddle.net/jgov83fg/25/

Answer 1

我做了一个copy您的 JSFiddle 并对其进行了一些更改。

我添加了Leaflet.MarkerCluster.LayerSupport JSFiddle HTML 的 body 标签中的子插件:

<script src="https://unpkg.com/<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="90fcf5f1f6fcf5e4befdf1e2fbf5e2f3fce5e3e4f5e2befcf1e9f5e2e3e5e0e0ffe2e4d0a2bea0bea1" rel="noreferrer noopener nofollow">[email protected]</a>/dist/leaflet.markercluster.layersupport.js"></script>

我将以下内容添加到 JavaScript 代码中:

var mcgLayerSupportGroup = L.markerClusterGroup.layerSupport(),
  group1 = L.layerGroup(),
  group2 = L.layerGroup(),
  group3 = L.layerGroup(),
  group4 = L.layerGroup(),
  control = L.control.layers(null, null, {
    collapsed: false
  }),
  i, a, title, marker;

mcgLayerSupportGroup.addTo(mymap);

mcgLayerSupportGroup.checkIn([group1, group2, group3, group4]);

control.addOverlay(group1, 'Anti-Social Behaviour');
control.addOverlay(group2, 'Violent Crime');
control.addOverlay(group3, 'Bicycle Theft');
control.addOverlay(group4, 'Burglary');
control.addTo(mymap);

group1.addTo(mymap); // Adding to map or to AutoMCG are now equivalent.
group2.addTo(mymap);
group3.addTo(mymap);
group4.addTo(mymap);

然后，在 create_marker 函数中，我调用 marker.addTo(group1)、marker2.addTo(group2)、marker3.addTo(group3) 或 marker4.addTo(group4) 基于标记所关联的犯罪类型。

希望这对您有所帮助，如果您有任何疑问，请告诉我。