Как получить latlng после события dragend в листовке?

Я пытаюсь обновить значение lat/lng маркера после его перемещения. В приведенном примере используется всплывающее окно для отображения lat/lng.

У меня есть прослушиватель событий "dragend" для маркера, но когда я предупреждаю о значении e.latlng, он возвращает undefined.

JavaScript:

function markerDrag(e){
    alert("You dragged to: " + e.latlng);
}

function initialize() {
    // Initialize the map
    var map = L.map('map').setView([38.487, -75.641], 8);
    L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
        attribution: 'Map data &copy; <a href="#" onclick="location.href='http://openstreetmap.org'; return false;">OpenStreetMap</a> contributors, <a href="#" onclick="location.href='http://creativecommons.org/licenses/by-sa/2.0/'; return false;">CC-BY-SA</a>',
        maxZoom: 18
    }).addTo(map);

    // Event Handlers
    map.on('click', function(e){
        var marker = new L.Marker(e.latlng, {draggable:true});
        marker.bindPopup("<strong>"+e.latlng+"</strong>").addTo(map);

        marker.on('dragend', markerDrag);
    });
}


$(document).ready(initialize());

http://jsfiddle.net/rhewitt/Msrpq/4/

Ответы

Ответ 1

Значение latlng не указано в e.latlng, а в e.target._latlng. Используйте консоль.

Ответ 2

Посмотрите на строку № 12 (№ 12) для кода, чтобы получить latlng обновленной позиции

    // Script for adding marker on map click
    function onMapClick(e) {

        var marker = L.marker(e.latlng, {
                 draggable:true,
                 title:"Resource location",
                 alt:"Resource Location",
                 riseOnHover:true
                }).addTo(map)
                  .bindPopup(e.latlng.toString()).openPopup();

        // #12 : Update marker popup content on changing it position
        marker.on("dragend",function(ev){

            var chagedPos = ev.target.getLatLng();
            this.bindPopup(chagedPos.toString()).openPopup();

        });
    }

Вот демонстрация JSFiddle

Ответ 3

При использовании e.target._latlng работает (как предложено этот другой ответ), лучше использовать

e.target.getLatLng();

Таким образом, мы не подвергаем какие-либо частные переменные, как рекомендуется Leaflet:

Частные свойства и методы начинаются с подчеркивания (_). Это не делает их частными, просто рекомендует разработчикам не использовать их напрямую.

Ответ 4

Я думаю, что API изменился.

В настоящее время это: const { lat, lng } = e.target.getCenter();