[GIS] Opening a popup on Marker click when Markers are in array using leaflet maps

leafletmapbox

Hey guys I have a set of Markers that are getting created dynamically on a .each loops like so.

$.each(data, function(index, element) {
    markerArr[element.id] = L.marker(map.unproject([element.LocationX,element.LocationY],map.getMaxZoom()-4)).addTo(map);
});

My question is how to open the popup for each popup on click and show the unique ID inside the popup?

I am able to do this if I were to declare each Marker with a unique name like so.

var marker1 = L.marker([158,395]).addTo(mapl);
var marker2 = L.marker([158,410]).addTo(mapl);
marker1.bindPopup("Kanye West");
marker1.on('click', function (e) {
    this.openPopup();
});
marker2.bindPopup("50 Cent");
marker2.on('click', function (e) {
    this.openPopup();
});

But I need to be able to open all Markers that are in the array instead.

Tried something like this with no luck

markerArr[this].on('click', function (e) {
    this.openPopup();
});

Best Answer

If the popup is bound to the marker, the click of the marker should fire it's associated popup (so you shouldn't need the marker.on('click', function(e){}) function).

Are you needing to fire the popup from events outside the map, based on the object's id?

Related Question