Как с листовкой показать с полилиниями на маркерных точках - PullRequest
0 голосов
/ 21 марта 2020

В моем приложении Laravel 6 / blade / jquery 3 / leaflet / turf мне нужно 1) показать набор маркеров и 2) соединить их с полилиниями. Далее мне нужно 3) когда пользователь нажимает на карту, чтобы определить, является ли это полилинией, и если да, 4) показывать всплывающее меню действий и с выбранной опцией «Добавить элемент» 5) разбивать точки на краю выбранной полилинии на 2 полилинии и еще 1 маркер , Я делаю это так:

const points = [
    {title:'title #1 ', lat:52.509, lng:-3.08},
    {title:'title #2 ', lat:51.503, lng:-1.06},
    {title:'title #3 ', lat:49.51, lng:-2.47}
];

var mymap = L.map('mapid').setView([51.505, -0.09], 7);

var popup = L.popup();

function onMapClick(e) {
    popup
        .setLatLng(e.latlng)
        .setContent("You clicked the map at " + e.latlng.toString())
        .openOn(mymap);
}

mymap.on('click', onMapClick);

drawPoints()
function drawPoints() {
    points.forEach(point => {
        const latlngs = L.marker([point.lat, point.lng]).addTo(mymap)
            .bindPopup(point.title);//.openPopup();

        // const ret= L.polyline(latlngs, { color: 'red' }).addTo(mymap)
        // var polyline = new L.Polyline(latlngs, {
        //     weight: 10, // THIS WAY DOES NOT WORK TOO
        // }).addTo(mymap);
        var polyline = new L.Polyline(point.lat, point.lng, {
            weight: 10,
        }).addTo(mymap);
    })
} // function drawPoints () {

В результате у меня есть множество маркеров, а не полилинии между маркерами. Как показать полилинии и, пожалуйста, дайте подсказки, как сделать шаги 3), 4), 5) с какими методами?

ИЗМЕНЕНО: Я нашел, как можно выполнить шаг 2:

    points.forEach(point => {
        const latlngs = L.marker([point.lat, point.lng]).addTo(mymap)
            .bindPopup(point.title);//.openPopup();
        polylinePoints[polylinePoints.length]=[point.lat, point.lng]
    })

    var polyline = L.polyline(polylinePoints, {color: 'red'}).addTo(mymap);
    mymap.fitBounds(polyline.getBounds());

Любые подсказки, как для шагов 3,4,5, пожалуйста.

Спасибо!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...