Mapbox / Leaflet.Markercluster Bug Replication
HTML
<script src="http://api.tiles.mapbox.com/mapbox.js/v1.0.3/mapbox.js"></script>
<script src="http://dev.vinpin.com/data/js/leaflet.markercluster.js"></script>
<link rel="stylesheet" href="http://dev.vinpin.com/data/css/MarkerCluster.css">
<link rel="stylesheet" href="http://dev.vinpin.com/data/css/MarkerCluster.Default.css">
<link rel="stylesheet" href="http://api.tiles.mapbox.com/mapbox.js/v1.0.3/mapbox.css">
<div id="map" style="height: 300px"></div>
JavaScript
var map = L.mapbox.map('map', 'vinpinr.map-atckgbg8');
var markers = new L.MarkerClusterGroup();
var json = [
{
type: 'Feature',
geometry: {
type: 'Point',
coordinates: [-28, 49]
},
properties: {}
},
{
type: 'Feature',
geometry: {
type: 'Point',
coordinates: [-18, 49]
},
properties: {}
},
{
type: 'Feature',
geometry: {
type: 'Point',
coordinates: [-38, 49]
},
properties: {}
}
];
for (var i = 0; i < json.length; i++) {
var item = json[i];
var marker = {
type: 'Feature',
geometry: {
type: 'Point',
coordinates: [item.geometry.coordinates[0], item.geometry.coordinates[1]]
},
properties: {}
};
var randomNumber = new Date().getTime();
marker.properties.title = 'title ' + randomNumber;
marker.properties.description = 'description ' + randomNumber;
var markerObject = L.mapbox.markerLayer(marker);
// Add to cluster
markers.addLayer(markerObject);
}
map.addLayer(markers);
markers.eachLayer(function(marker) {
// This (in my case) is always the same, but not here :(
console.log(marker.feature.properties.title);
});