Question

我对javascript很新，我想让我的项目运行。目标是有条件地显示几个叠加层 - 所以如果同时添加了Layer1和Layer2（由复选框中的用户签出），则应运行LayerControl。

另外：如果删除了其中一个，则应该从地图中完全删除该控件。

我在检查两个图层是否同时添加时遇到问题。和＆amp;＆amp; （AND）以及|| （或）不适合我。这是我的代码示例：

map1.on({
overlayadd: function(e1,e2) {
    if (e1.name === 'LAYER1'&& e2.name==='LAYER2'){
    sBs01 = L.control.sideBySide(LAYER1,LAYER2);
    sBs01.addTo(map1);
    }
},
overlayremove: function(e) {
    if (e.name === 'LAYER1'|| e.name==='LAYER2') {
    map1.removeControl(sBs01)
    }
}});

这应该很简单，但我想我错过了一些东西。

我也以另一种方式尝试，通过添加IF两次避免AND / OR，如下所示：

map1.on('overlayadd', function(eventlayer){ 
    if (eventlayer.layer==LAYER1) {
        map1.on('overlayadd', function (eventlayer2)
        {
            if(eventlayer2.layer==LAYER2){
            sBs01 = L.control.sideBySide(LAYER1,LAYER2);
            sBs01.addTo(this);
            }    
        }       )
        } } );

它完成工作但不是最佳。如果删除了2个图层中的任何一个，则稍后尝试移除控件时会出现这些问题。

请帮助我解决这个问题，这对我来说意味着一个世界！

Answer 1

您正在使用overlayadd / overlayremove事件，这些事件仅在通过L.Control.Layers 添加/删除图层时才有效。如果通过其他方式添加/删除图层，则可能会出现问题。

我建议您使用layeradd / layerremove个事件（请参阅http://leafletjs.com/reference-1.3.0.html#map-event），并在图层控件中检查L.Layer的实例而不是其名称。

此外，由于事件的性质，您只能获得受该事件影响的图层的引用（名称或实例）。您正在撰写overlayadd: function(e1,e2) {，但事件处理函数无法同时接收两个事件（请参阅http://leafletjs.com/reference-1.3.0.html#evented-on），更不用说您预期的顺序。

如果您想检查添加到地图（或不存在）的图层组合，请改用L.Map＆＃39; s hasLayer()。请参阅http://leafletjs.com/reference-1.3.0.html#map-haslayer。

Answer 2

非常感谢您的回答和有用的意见，@ IvanSanchez！

所有图层都是通过L.Control.Layers添加的，因此overlayadd和overlayremove确实适用于他们。然而，我确实使用hasLayer()来检查有关图层的条件，并且它有效:)

这样的事情有效：

sBs01 = L.control.sideBySide(LAYER1,LAYER2);
    map.on('overlayadd', function(eventlayer){ 
        if(eventlayer.layer===LAYER1){
        if(map.hasLayer(LAYER1)){
            sBs1.addTo(this); 
            }});

与此类似，对于overlayremove。它可能对某人有帮助。

Leaflet js overlayadd / overlayremove - 如何检查多个图层？

2 个答案: