Skip to content

Instantly share code, notes, and snippets.

@EricMcRay

EricMcRay/marker_popup.js

Last active September 7, 2015 10:32
Show Gist options
  • Save EricMcRay/a87eda884bef20264c65 to your computer and use it in GitHub Desktop.
Save EricMcRay/a87eda884bef20264c65 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
marker_popup.js
/* jshint devel:true */
L.mapbox.accessToken = '*************************';
var id = 1;
var map = L.mapbox.map('map', 'mapbox.dc-markers');
var markers = [];
var currentIndex;
// Open popup when user mouses over a marker
map.featureLayer.on('ready', function(e) {
this.eachLayer(function(marker) {
var marker.id = id;
var index = markers.length - 1;
markers.push(marker);
console.log(marker._leaflet_id);
id++;
});
var content = '<button class="next-marker" onclick="nextMarker('+ (index + 1) +')">Next</button>';
this.bindPopup(content);
});
map.on('popupopen', function(e) {
var marker = e.popup._source;
currentIndex = findIndex(markers, 'id', marker.id);
console.log(marker);
document.getElementById('next-marker').onclick = nextMarker;
});
function nextMarker(index){
markers[index].closePopup();
markers[index + 1].openPopup();
}
function previousMarker(index){
markers[index].closePopup();
markers[index - 1].openPopup();
}
function findIndex(array, key, value){
var index = -1;
array.forEach(function(item, i){
if(item[key] === value){
index = i;
}
});
return index;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment