how to pass data with marker in leaflet js

Question

I am using leaflet js with openstreetmap in my project.
I have multiple circlemarkers at same place in my map.
I want to store some Id in that circlemarkers so that I can Identify that which data should be refereed when circlemarker is clicked.

My circlemarker is

var myMarker = L.circleMarker(myPoint, { title: 'unselected', radius: 20 }); myMarker.addTo(map);  

Here I am using title for other purpose that's why I cant use it.
Can any one tell me some way to do this.

Answer 1

It sounds like you would like to add new functionality (functions, properties, etc) to an existing class. It would make sense to use object-oriented principals for this. For this purpose, I'd recommend you extending the CircleMarker class to add those properties.

customCircleMarker = L.CircleMarker.extend({    options: {        someCustomProperty: 'Custom data!',       anotherCustomProperty: 'More data!'    } }); 

Now when you create your circle marker, create an instance of your extended object instead.

var myMarker = new customCircleMarker(myPoint, {      title: 'unselected',     radius: 20,     someCustomProperty: 'Adding custom data to this marker!',     anotherCustomProperty: 'More custom data to this marker!' }); myMarker.addTo(map); 

Now you can get the properties like you would any other option from the marker. This is just a simple case of extending, and you can do more as needed, such as adding other properties or functions to the object.

JSFiddle example: JSFiddle