小叶控制不过滤标记

时间:2018-02-08 18:32:38

标签: javascript leaflet

我正试图实施过滤器'在标记聚类器旁边的我的传单地图中,我已经有了控制框并绘制了标记,但是在取消了一个类别'地图上没有任何更新我已经附上了这个功能正在运行的示例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/

1 个答案:

答案 0 :(得分:3)

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

我将Leaflet.MarkerCluster.LayerSupport子插件包含在JSFiddle HTML的body标签中:

<script src="https://unpkg.com/leaflet.markercluster.layersupport@2.0.1/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)有关联。

希望这有帮助,如果您有任何问题,请与我联系。