如何在显示或隐藏Leaflet LayerGroup时收到通知?

JJD*_*JJD 1 javascript javascript-events onclicklistener leaflet

我想在用户单击图层控件中的"城市"复选框时收到通知 - 该图标控件显示或隐藏链接示例中的城市标记.这是一个可以玩的JSFiddle.

宣传单截图

我看到LayerGroupFeatureGroup派生了一些事件.如果我错了请纠正我:据我所知,显示和隐藏标记与layeraddlayerremove不一样?!

input元素不能id绑定到:

<label>
    <input class="leaflet-control-layers-selector" type="checkbox" checked="">
    <span> Cities</span>
</label>
Run Code Online (Sandbox Code Playgroud)

如何切换标记的可见性时如何通知?

Ale*_*fan 5

你可以使用jQuery来选择输入元素,使用它的类:

$('.leaflet-control-layers-selector').click(function(){
    alert('something')
});
Run Code Online (Sandbox Code Playgroud)

此外,如果您有多个图层,则可以在单击其中一个复选框时检查地图是否包含一个图层.

$('.leaflet-control-layers-selector').click(function(){
    if(map.hasLayer(cities)) alert('something');
});
Run Code Online (Sandbox Code Playgroud)

UPDATE

您还可以使用地图事件overlayadd和overlayremove,如下所示:

map.on({
    overlayadd: function(e) {
        if (e.name === 'Cities') alert('added');
    },
    overlayremove: function(e) {
        if (e.name === 'Cities') alert('removed');
    }
});
Run Code Online (Sandbox Code Playgroud)

这是你的例子的更新JSFiddle:http://jsfiddle.net/pufanalexandru/g54efr69/1/