<style>
#open-popup {
position:absolute;
top:5px;
right:5px;
}
</style>
<div id='map'></div>
<button id='open-popup'>open popup</button>
<script>
var map = L.mapbox.map('map', 'examples.map-zr0njcqy');
// wait until the markers are loaded, so we know that `map.markerLayer.eachLayer`
// will actually go over each marker
map.markerLayer.on('ready', function(e) {
// when a user clicks the button run the `clickButton` function.
// Thanks to function hoisting in Javascript, we can define the function
// after we reference it here.
document.getElementById('open-popup').onclick = clickButton;
});
function clickButton() {
map.markerLayer.eachLayer(function(marker) {
// you can replace this test for anything else, to choose the right
// marker on which to open a popup. by default, popups are exclusive
// so opening a new one will close all of the others.
if (marker.feature.properties.title === 'Capital Pride Parade') {
marker.openPopup();
}
});
}
</script>