web-dev-qa-db-fra.com

Obtenir les coordonnées de la carte à partir de Leaflet.js?

J'essaie d'utiliser Leaflet pour obtenir les coordonnées de la carte d'un endroit sur lequel un utilisateur a cliqué avec le bouton droit. J'ai parcouru l'API Leaflet et jusqu'à présent, j'ai compris que je devais écouter l'événement contextmenu et utiliser mouseEventToLatLngméthode pour obtenir le coordonnées lorsque vous cliquez dessus. Cependant, lorsque je passe en revue et débogue mon code, je ne vois aucune variable latLng accessible nulle part. Ai-je manqué de comprendre quelque chose dans l'API?

function setMarkers() {
        document.getElementById("transitmap").addEventListener("contextmenu", function( event ) {
            // Prevent the browser's context menu from appearing
            event.preventDefault();

            var coords = L.mouseEventToLatLng( event );
        });
    };
javascriptleaflet
12
tylerbhughes

Ce que vous voulez obtenir, c'est mousemove événement. Voici comment vous le faites,

var lat, lng;

map.addEventListener('mousemove', function(ev) {
   lat = ev.latlng.lat;
   lng = ev.latlng.lng;
});

document.getElementById("transitmap").addEventListener("contextmenu", function (event) {
    // Prevent the browser's context menu from appearing
    event.preventDefault();

    // Add marker
    // L.marker([lat, lng], ....).addTo(map);
    alert(lat + ' - ' + lng);

    return false; // To disable default popup.
});
12
vadi taslim

Les coordonnées de l'événement de clic droit doivent être directement disponibles sous la forme propriété latlng de l'argument event du "contextmenu" auditeur.

map.on("contextmenu", function (event) {
  console.log("Coordinates: " + event.latlng.toString());
  L.marker(event.latlng).addTo(map);
});

Démo: http://plnkr.co/edit/9vm81YsQxnkAFs35N8Jo?p=preview

7
ghybs