Leaflet animated marker not displaying the latitude and longitude

Question

I am using this code it shows the message in a popup when I remove the e.latlng.lat and + e.latlng.lng

var myMovingMarker = L.Marker.movingMarker([
  [23.59582641820334, 58.439605236053474],
  [21.5278654, 55.9196996]
], [100000], {
  icon: orangeIcon
}, {
  title: "MyPoint",
  alt: "The Big I",
  draggable: true
}, )

var popup = L.popup({
  keepInView: false,
  autoPan: false,
  closeButton: false,
  closeOnClick: true,
  maxWidth: 1000

}).setContent("Lat, Lon : " + e.latlng.lat + ", " + e.latlng.lng)

myMovingMarker.bindPopup(popup).openPopup()

Have you add marker to map L.Marker.movingMarker().addTo(map) — User863
yes and it shows and display the popup when i write it like this =>>> .setContent("Lat, Lon : " ) but when i ask for lat lng the marker doent display — salman m

Falke Design Falke Design · Accepted Answer · 2020-12-15T09:25:28

The variable e is not defined. Additionally setContent() set a static content, this means when you add text with setContent() is will not updated, even if the marker latlng has changed.

You have to set the content every time the popup is opened:

myMovingMarker.on('popupopen',function(e){
    var markerLatLng = e.popup._source.getLatLng();
    e.popup.setContent("Lat, Lon : " + markerLatLng.lat + ", " + markerLatLng.lng)
  })

Another way would be to updated the content every time the marker is moved:

myMovingMarker.on('move',function(e){
    var markerLatLng = e.target.getLatLng();
    popup.setContent("Lat, Lon : " + markerLatLng.lat + ", " + markerLatLng.lng)
  })

PS: Both not tested, but should work

Leaflet animated marker not displaying the latitude and longitude

1 Answers