Marker in leaflet click event

Question

var map   L map  map    var marker   L marker  10 496093 -66 881935   on  click   onClick   function onClick e   alert e latlng    marker addTo map    When I do click in the marker  the alert message is  undefined  But if I put it in the variable map  it works   shows latitude and longitude   map on  click   onClick      Does someone know why it doesn t work in the marker

User · Accepted Answer

I found the solution   function onClick e   alert this getLatLng        used the method getLatLng   of the marker

User · Answer

Additional relevant info  A common need is to pass the ID of the object represented by the marker to some ajax call for the purpose of fetching more info from the server   It seems that when we do   marker on  click   function e         The e points to a MouseEvent  which does not let us get to the marker object  But there is a built-in this object which strangely  requires us to use this options to get to the options object which let us pass anything we need  In the above case  we can pass some ID in an option  let s say objid then within the function above  we can get the value by invoking  this options objid

User · Answer

A little late to the party  found this while looking for an example of the marker click event  The undefined error the original poster got is because the onClick function is referred to before it s defined  Swap line 2 and 3 and it should work

User · Answer

The accepted answer is correct  However  I needed a little bit more clarity  so in case someone else does too   Leaflet allows events to fire on virtually anything you do on its map  in this case a marker   So you could create a marker as suggested by the question above   L marker  10 496093 -66 881935   addTo map  on  mouseover   onClick     Then create the onClick function   function onClick e        alert this getLatLng         Now anytime you mouseover that marker it will fire an alert of the current lat long   However  you could use  click    dblclick   etc  instead of  mouseover  and instead of alerting lat long you can use the body of onClick to do anything else you want   L marker  10 496093 -66 881935   addTo map  on  click   function e        console log e latlng         Here is the documentation  http   leafletjs com reference html events

User · Answer

Here s a jsfiddle with a function call  https   jsfiddle net 8282emwn   var marker   new L Marker  46 947  7 4448   on  click   markerOnClick  addTo map    function markerOnClick e      alert  hi  you clicked the marker at     e latlng

[javascript] Marker in leaflet, click event

Examples related to javascript

Examples related to leaflet