2016-11-11 6 views
2

私はリーフレットマップ上にドラッグして落としたマーカーの緯度と経度を取得しようとしています。リーフレットで「dragend」イベントのLatLngを取得するにはどうすればよいですか?

しかし、私はいつも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...} 

誰かがこの上でアドバイスしていただけますか?

ありがとうございます。

答えて

4

あなたはL.Markerdragendイベントを聞いています。 documentation for thatを見ると、dragendイベントが発生し、DragEndEvent, which only has distance, type and target propertiesを受け取るイベントイベントハンドラが表示されます。いいえlatlng。それは予想通りだ。

DragEndEventtargetプロパティは、L.Markerインスタンスです。だから、:それも

  • 存在しないため、

    • あなたはDragEndEventtargetあるL.MarkerLatLngたい、はないDragEndEventLatLngたいです。

    LatLngL.Markerです。そのgetLatLng()メソッドを使用します。したがって:

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

    working exampleを参照してください。

  • 関連する問題