Leaflet: изменить стиль линии GPX по клику - PullRequest
Новая
       18

Leaflet: изменить стиль линии GPX по клику

0 голосов
/ 26 мая 2019

Я на самом деле обновляю карты на моем (Wordpress / Bootstrap 4) веб-сайте с листовки 0.7 до листовки 1.5.На моем веб-сайте я представляю множество туров Mountainbike, каждый из которых связан с файлом GPX.Я хочу показать все эти туры на одной карте, каждый с модальным диалогом BS, который показывает дополнительную информацию.

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

Мне удалось решить почти все эти шаги, кроме последнего: после выделения дорожка остается выделенной и не возвращается в прежнее состояние.

Это мой рабочий код, например:

var MyMTBtour = omnivore.gpx('https://.../MyMTBtour.gpx').addTo(map)

        .on('click', function () {
        map.fitBounds(MyMTBtour.getBounds());
        MyMTBtour.setStyle({
            "color": "orange",
            weight: 10,
            "opacity": 0.8
            });
        });

        MyMTBtour.on('ready', function () {
        MyMTBtour.eachLayer(function (line) {
            line.setStyle({
                color: 'yellow',
                weight: 5,
                "opacity": 0.5
                });
            });
        });

        MyMTBtour.on('click', function(e) {
        $('#MyMTBtour_Modal').modal('show');
        });

        map.on('click', function(e) {
        $('#MyMTBtour_Modal').modal('hide');
        });

В предыдущей версии этой карты (на основе Leaflet 0.7) мне удалось получить такое поведение с помощью этой функции: 

map.on('click', function () {
    MyMTBtour.eachLayer(function (line) {
        line.setStyle({
            color: 'yellow',
            weight: 5
        });
    });
 });

Однако с Leaflet 1.5 это неработать больше (изменение API?).Я также пытался связать желаемое изменение стиля с модальным (скрытым) событием, но мне не удалось заставить его работать.

Любая помощь с благодарностью.Спасибо!

...