我使用leaflet.js库根据统计数据创建多个地图。每个地图都显示不同的值范围,因此在用户更改地图时更改图例会很不错。
我在此question中找到了类似的示例,但我需要在两个以上的层之间切换。我尝试在代码中添加更多“if”语句和逻辑运算符,但它不能正常工作:
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);
}
})
Here is example of my map on jsfiddle. 我将不胜感激任何帮助。
答案 0 :(得分:2)
VODlegend || BUDlegend || LISlegend
在javascript中,这是一个条件(结果为true或false)...不是您期望的列表
您需要跟踪当前的控件
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/