Листовки с надписями добавить и удалить в подключенную группу слоев - PullRequest
0 голосов
/ 22 февраля 2020

Я могу изменить легенды (legend1 и 2) при добавлении оверлеев (не базовых карт). При добавлении оверлея1_имя отображается легенда1, но при удалении оверлей1_имя легенда1 не удаляется. При добавлении overlay2_name удаляется легенда1 и отображается легенда2, при удалении оверлея2_имя легенда2 не удаляется. У меня около 10 оверлеев, и легенды не отображаются при активации оверлеев, не связанных с легендами, но как только я активирую overlay1_name или 2, я не могу удалить легенды со страницы без обновления. Это не поможет добавить любой другой слой, чтобы удалить легенды. Немного боли иметь легенды, которые не относятся к данным, показанным на карте. Как это можно исправить? Пример кода ниже ...


         map.on('overlayadd', function(eventLayer){
          // Switch the legends...
        if (eventLayer.name === 'overlay1_name') {
            legend1.addTo(map);
            map.removeControl(legend2);
        } else if (eventLayer.name === 'overlay2_name') {
            legend2.addTo(map);
            map.removeControl(legend1);
        }
    });

    map.on('overlayremove', function(eventLayer){
        if (eventLayer.name === 'overlay1_name'){
            map.removeControl(legend1);
        } else if (eventLayer.name === 'overlay2_name') {
            map.removeControl(legend2);
    }
    });

        function getColor1(d) {
        switch(d) {
                case 1: return '#2c7bb6';
                case 2: return '#abd9e9';
                case 3: return '#1a9641';
                case 4: return '#a6d96a';
                case 5: return '#ffffbf';
                case 6: return '#fdae61';
                case 7: return '#d7191c';
                default: return '#ffffff';
                }
       };

    var legend1 = L.control({position: 'bottomleft'});

    legend.onAdd = function (map) {

    var legdiv = L.DomUtil.create('div', 'info legend'),
        grades = [1, 2, 3, 4, 5, 6, 7],
        labels = ['0 < 2', '2 < 5', '5 < 10', '10 < 15', '15 < 25', '25 < 50', '> 50' ],
        title = '<b>Total items</b><br>';

        legdiv.innerHTML += title;
    // loop through our density intervals and generate a label with a colored square for each interval
    for (var i = 0; i < grades.length; i++) {
        legdiv.innerHTML +=
            '<i style="background:' + getColor1(grades[i]) + '"></i> ' +
            (grades[i] ? labels[i] + '<br>' : '+');
    }

    return legdiv;
    };

1 Ответ

0 голосов
/ 23 февраля 2020

Используя map.on (функция overlayremove), я смог получить желаемый результат. Я изменил приведенный выше пример кода, если кто-то ищет аналогичный ...

...