javascript - Leaflet js overrideadd/overlayremove - 如何检查不止一层？

Question

我对 javascript 相当陌生，我正在尝试让我的项目运行。目标是有条件地显示多个叠加层 - 因此，如果 Layer1 和 Layer2 均已添加(由用户在复选框中选中)，则应运行 LayerControl。

另外:如果其中一个被删除，则该控件应该从 map 上完全删除。

我在检查两个图层是否同时添加时遇到问题。 && (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 )，更不用说按照您期望的顺序接收了.

如果您想检查 map 中添加(或不存在)的图层组合，请使用 L.Map 的 hasLayer() 代替。请参阅http://leafletjs.com/reference-1.3.0.html#map-haslayer .