Menggunakan Leaflet Js, apakah mungkin untuk mengetahui lokasi onclick dari Marker (abaikan anchor point)?

Saya memiliki objek marker yang memiliki tinggi dan lebar spesifik, dan meskipun menunjuk satu koordinat, representasi visual marker mencakup banyak piksel. Ketika saya mengklik representasi visual dari marker, saya ingin mendapatkan koordinat peta yang mendasarinya, tetapi saya hanya memiliki akses ke koordinat lat / lng tunggal yang terkait dengan marker tersebut.

leaflet coordinates markers

— DarkKunai99
sumber

Jawaban:

Di satu sisi: setiap kali Leaflet menangani acara mouse (atau sentuhan), Anda dapat mengakses acara DOM asli di originalEventproperti acara.

Di sisi lain: Diberikan acara DOM mouse (atau sentuh), Leaflet secara ajaib dapat menerjemahkan clientXdan clientYpropertinya menjadi turunan L.LatLngdengan menggunakan map.mouseEventToLatLng().

Gabungkan kedua hal ini bersama-sama, dan Anda dapat memiliki sesuatu seperti:

marker.on('click', function(ev){
  var latlng = map.mouseEventToLatLng(ev.originalEvent);
  console.log(latlng.lat + ', ' + latlng.lng);
});

Periksa dokumentasi Leaflet untuk metode konversi lain, karena metode ini terbukti bermanfaat.

— Ivan Sanchez
sumber

Terima kasih, itu berhasil. Saya sedang menghitung latlng berdasarkan jumlah piksel seperti:

var latlng = self._map.containerPointToLatLng([event.originalEvent.clientX - vpWidthDifference, event.originalEvent.clientY - vpHeightDifference]);

— DarkKunai99

Anda selalu dapat mengambil koordinat dari peta objek Leaflet. Anda dapat menggunakan sesuatu seperti ini:

map.on('click', function(e){
  var coord = e.latlng;
  var lat = coord.lat;
  var lng = coord.lng;
  console.log("You clicked the map at latitude: " + lat + " and longitude: " + lng);
  });

Di sini Anda memiliki contoh yang berfungsi.

— ramiroaznar
sumber

Hmm, ini aneh karena saya menjalankan Cesium v1.25, dan setiap kali saya mengklik marker, objek acara selalu berisi latlng dari titik anchor marker, bukan koordinat aktual peta seperti pada contoh Anda.

— DarkKunai99

Saya belum bekerja dengan Cesium, mungkin Ivan atau di cesiumtag dapat memberi Anda jawaban yang lebih baik.

— ramiroaznar

Saya minta maaf, saya bermaksud mengatakan Leaflet (rc v1.0 terbaru)

— DarkKunai99

Lihatlah jawaban yang diberikan oleh Ivan, itu akan memecahkan masalah Anda. Milik saya seperti yang Anda katakan menggunakan versi Leaflet yang sangat lama (saya tidak tahu dari mana saya menyalinnya).

— ramiroaznar