0

I couldn't get the popup to show up when I click on the points. (My point data is stored in the variable "markers").

var mymap = L.map('mapid').setView([30, 120], 5);

L.tileLayer('https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}', {
    attribution: 'Map data &copy; <a href="https://www.openstreetmap.org/">OpenStreetMap</a> contributors, <a href="https://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="https://www.mapbox.com/">Mapbox</a>',
    maxZoom: 18,
    id: 'mapbox/streets-v11',
    tileSize: 512,
    zoomOffset: -1,
    accessToken: ‘hided’
}).addTo(mymap);

var myIcon = L.icon({
  iconUrl: 'graveyard.svg',
  iconSize: [30, 30],
  iconAnchor: [9, 21],
  popupAnchor: [0, -14]
});

var markerClusters = L.markerClusterGroup(
  {spiderfyOnMaxZoom: true}
);

for ( var i = 0; i < markers.length; ++i )
{
  var type = markers[i].domain_ch
  var popup = markers[i].name + '<br/><b>Type:</b> ' + markers[i].domain_ch;
  var m = L.marker([markers[i].Latitude, markers[i].Longitude], {icon: myIcon}, {}).bindPopup(popup);
  markerClusters.addLayer(m);
}

mymap.addLayer(markerClusters);

markerClusters.on('clusterclick', function (a) {
    a.layer.zoomToBounds({padding: [20, 20]});
});

I have tried without the clustering and with a single point. But neither of them work. No error was thrown in the console.

Browse other questions tagged or ask your own question.