javascript - Leaflet.js - 点击时设置标记，拖动时更新位置

Question

对于我正在处理的一个小项目，我需要能够在 Leaflet.js 驱动的图像地图上放置一个标记，并在它被拖动时更新该标记的位置。我使用下面的代码来尝试这个，但它失败了。我收到错误“未定义标记”。我不知道为什么它不起作用 - 也许你们可以帮助我？;)

function onMapClick(e) {
    gib_uni();
    marker = new L.marker(e.latlng, {id:uni, icon:redIcon, draggable:'true'};
    map.addLayer(marker);
};

marker.on('dragend', function(event){
    var marker = event.target;
    var position = marker.getLatLng();
    alert(position);
    marker.setLatLng([position],{id:uni,draggable:'true'}).bindPopup(position).update();
});

Answer 1

在上面的代码片段中，在添加事件处理程序时没有定义标记。尝试以下操作，在创建标记后立即添加 dragend 侦听器：

function onMapClick(e) {
    gib_uni();
    marker = new L.marker(e.latlng, {id:uni, icon:redIcon, draggable:'true'});
    marker.on('dragend', function(event){
            var marker = event.target;
            var position = marker.getLatLng();
            console.log(position);
            marker.setLatLng(position,{id:uni,draggable:'true'}).bindPopup(position).update();
    });
    map.addLayer(marker);
};

您还缺少新 L.Marker() 行末尾的括号。

您还在position调用中放入了一个数组，setLatLng但它已经是一个LatLng对象。