Как переключаться между несколькими легендами карты с помощью leaflet.js?

Я использую библиотеку leaflet.js для создания нескольких карт на основе статистических данных. Каждая карта отображает разные диапазоны значений, поэтому было бы неплохо изменить легенду, когда пользователь меняет карту.

Я нашел аналогичный пример в этом вопросе, но мне нужно переключаться между более двух слоев. Я пытаюсь просто добавить больше операторов 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);
    }
  })

Вот пример моей карты на jsfiddle. Буду благодарен за любую помощь.


javascript maps leaflet legend
person Yaroslav    schedule 31.07.2014    source источник

Ответы (1)


arrow_upward
3
arrow_downward

VODлегенда || БАДлегенда || LISлегенда

В 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/

person YaFred    schedule 31.07.2014