2013-08-22 5 views
15

Ich versuche den lat/lng Wert eines Markers zu aktualisieren, nachdem er verschoben wurde. Das Beispiel verwendet ein Popup-Fenster, um das lat/lng anzuzeigen.Wie erhalte ich das Datum nach dem Ereignis in der Broschüre?

Ich habe einen "dragend" Event-Listener für den Marker, aber wenn ich den Wert von e.latlng alarmiere, gibt es undefined zurück.

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="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">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/

Antwort

14

latlng Wert ist nicht in e.latlng aber in e.target._latlng. Verwenden Sie die Konsole.

+2

Wie haben Sie die Konsole finden, dass es eigentlich 'e.target._latlng'? – Roy

+0

Setzen Sie einen Debugger in Geige – lintu

+0

Geben Sie ein Beispiel? Ich weiß nicht, wie ich eine Eigenschaft austrage, die mir nicht bekannt ist. – Roy

11

Blick auf die Linie Nr 12 (# 12) zum Code der aktualisierten Position zu erhalten 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's position 
     marker.on("dragend",function(ev){ 

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

     }); 
    } 

Hier ist JSFiddle demo

+0

Das Schlüsselstück von diesem, das die Frage des OP beantwortet, ist 'ev.target.getLatLng()'. – Matt

5

Während e.target._latlng Arbeiten mit (wie von this other answer vorgeschlagen), ist es besser Praxis verwenden

e.target.getLatLng(); 

auf diese Weise wir keine privaten Variablen ausgesetzt wird, wie von Leaflet empfohlen:

Private Eigenschaften und Methoden beginnen mit einem Unterstrich (_). Dies macht sie nicht privat, sondern empfiehlt Entwicklern, sie nicht direkt zu verwenden.

+0

e.target.getLatLng ist keine Funktion –

+0

BTW, 'const {lat, lng} = e.target.getCenter();' funktioniert perfekt für mich –

0

Ich denke, die API geändert.

Heute ist: const { lat, lng } = e.target.getCenter();

+0

Auf welches Objekt klicken Sie und welche Version von Leaflet? Ich sehe nur die Methode 'getCenter()' für 'L.map',' L.latLngBounds' und 'L.polyline' für [Leaflet 1.0.3] (http://leafletjs.com/reference-1.0.3) .html). Auf der anderen Seite ist 'getLatLng()' für 'L.marker',' L.popup' und 'L.circleMarker' verfügbar. – user2441511

+0

Die API hat sich nicht geändert. In 1.3.0 ist dies für Marker immer noch "e.target.getLatLng()". – Matt

Verwandte Themen