如何使用leaflet.js多个地图图例之间切换?(How to switch between mu

2019-10-30 11:08发布

我真的使用leaflet.js库创建基于统计数据的多个地图。 每个地图显示不同的数值范围,因此将是很好的改变说明当用户改变地图。

我发现类似的例子在这个问题 ,但我需要两个以上的层之间进行切换。 我尝试只需添加更多的“如果” statments和代码逻辑运算符,但它不`吨工作的权利:

map.on('baselayerchange', function (eventLayer) {
    if (eventLayer.name === 'Agricultural') {
        map.removeControl(VODlegend || BUDlegend || LISlegend);
        SGlegend.addTo(map);
    }
    else if  (eventLayer.name === 'Building') {
        map.removeControl(SGlegend || LISlegend || VODlegend);
        BUDlegend.addTo(map);
    }
    else if  (eventLayer.name === 'Forest') {
        map.removeControl(BUDlegend || VODlegend || SGlegend);
        LISlegend.addTo(map);
    }
    else if  (eventLayer.name === 'Water') {
        map.removeControl(LISlegend || SGlegend || BUDlegend);
        VODlegend.addTo(map);
    }
  })

这里是我的例子上的jsfiddle地图。 我会感谢任何帮助。

Answer 1:

VODlegend || BUDlegend || LISlegend

在JavaScript中,这是一个条件(结果为真或假的)......不像你想象的列表

你需要保持当前的控制一样,轨道

SGlegend.addTo(map);
currentLegend = SGlegend;


map.on('baselayerchange', function (eventLayer) {
    if (eventLayer.name === 'Agricultural') {
        map.removeControl(currentLegend );
        currentLegend = SGlegend;
        SGlegend.addTo(map);
    }
    else if  (eventLayer.name === 'Building') {
        map.removeControl(currentLegend );
        currentLegend = BUDlegend;
        BUDlegend.addTo(map);
    }
    else if  (eventLayer.name === 'Forest') {
       map.removeControl(currentLegend );
        currentLegend = LISlegend;
        LISlegend.addTo(map);
    }
    else if  (eventLayer.name === 'Water') {
       map.removeControl(currentLegend );
        currentLegend = VODlegend;
       VODlegend.addTo(map);
    }
  })

改进的小提琴是在这里: http://jsfiddle.net/FranceImage/X678g/



文章来源: How to switch between multiple map legends with leaflet.js?