如何获得" dragend"的LatLng Leaflet活动?

时间:2016-11-11 10:43:38

标签: javascript leaflet

我试图在传单地图上获取拖拽和长拖拽标记。

但是,我经常遇到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);
  });
}

当我看到控制台内部时,我看到了错误。

但是当我将此console.log(mylat);更改为此console.log(result);时,我会在控制台中看到lat和long,但它们的格式并不是我想要的。

这是我在控制台中使用此console.log(result);拖放代码时所得到的内容:

 Object { lat=51.564025924107554,  lng=0.7077598571777344,  equals=function(),  more...}

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

提前致谢。

1 个答案:

答案 0 :(得分:5)

您正在收听L.Marker dragend次活动。如果您查看documentation for that,您会看到dragend个事件会触发收到DragEndEvent, which only has distance, type and target properties的事件处理程序。没有latlng。这是预期的。

现在,target的{​​{1}}属性是DragEndEvent实例。所以:

  • 想要L.Marker LatLng,因为它不存在
  • 您需要DragEndEvent的{​​{1}} LatLng L.Marker

你如何获得target的{​​{1}}?使用DragEndEvent方法。所以:

LatLng

查看working example