如何在Leaflet中获得LatLng的"dragend"事件?

Jac*_*son 2 javascript leaflet

我正试图在Leaflet地图上获得lat和long拖放标记.

但是,我经常遇到TypeError: event.latlng is undefined错误.

这是我的整个代码:

var map = L.map('map');

googleStreets = L.tileLayer('http://{s}.google.com/vt/lyrs=m&x={x}&y={y}&z={z}',{
  maxZoom: 20,
  subdomains:['mt0','mt1','mt2','mt3']
}).addTo(map);

map.locate({
  setView: true, 
  maxZoom: 16, 
  watch:false, 
  timeout: 60000,
  enableHighAccuracy: true
});
var marker; 
var circles;

function onLocationFound(e) {
  var radius = e.accuracy / 2;

  if(map.hasLayer(circles) && map.hasLayer(marker)) {
    map.removeLayer(circles);
    map.removeLayer(marker);
  } 

  marker = new L.Marker(e.latlng, {draggable:true});
  circles = new L.circle(e.latlng, radius);
  circles.bindPopup("You are within " + radius + " meters from this point").openPopup();;

  map.addLayer(marker);
  map.addLayer(circles);

  marker.on('dragend', function(event) {
    var mylat = event.latlng.lat
    var result = marker.getLatLng(); 
    console.log(mylat);
  });
}
Run Code Online (Sandbox Code Playgroud)

当我在控制台内看到时,我看到了错误.

但是当我改变这个console.log(mylat);console.log(result);,我在控制台中看到了lat和long,但它们的格式并不是我想要的.

这是我在控制台中获取的内容,当我将标记拖放到代码时 console.log(result);:

 Object { lat=51.564025924107554,  lng=0.7077598571777344,  equals=function(),  more...}
Run Code Online (Sandbox Code Playgroud)

有人可以就此提出建议吗?

提前致谢.

Iva*_*hez 6

你在听一个L.Marker人的dragend活动.如果你看一下该文件,你会看到,dragend事件触发的事件处理程序,其接收DragEndEvent,其中只有distance,typetarget性能.不latlng.这是预期的.

现在,a的target属性DragEndEvent就是L.Marker实例.所以:

  • 想要LatLngDragEndEvent,因为它根本不存在
  • 您希望LatLng的的L.Marker这是targetDragEndEvent.

你怎么得到LatLng一个L.Marker?用它的getLatLng()方法.所以:

marker.on('dragend', function(event) {
  var latlng = event.target.getLatLng();
  console.log(latlng.lat, latlng.lng)
});
Run Code Online (Sandbox Code Playgroud)

查看一个工作示例.