问题
In Leaflet, I have too many marker points and I want to regroup them, I've tried the Leaflet.markercluster in Github but I don't understand.
Here a part of my code, above I have php code where I collect some data :
function initMap() {
macarte = L.map('map').setView([lat, lon], 6);
L.tileLayer('https://{s}.tile.openstreetmap.fr/osmfr/{z}/{x}/{y}.png', {
attribution: 'données © <a href="//osm.org/copyright">OpenStreetMap</a>/ODbL - rendu <a href="//openstreetmap.fr">OSM France</a>',
minZoom: 1,
maxZoom: 15
}).addTo(macarte);
var villes = <?= json_encode($resultat, JSON_UNESCAPED_UNICODE) ?>;
var i;
for (i = 0; i < villes.length; i++) {
var nom = villes[i][0];
var latitude = villes[i][1];
var longitude = villes[i][2];
var adresse1 = villes[i][3];
var cp = villes[i][4];
var ville = villes[i][5];
var content =
'<div>' +
'<h3>' + nom + '</h3>' +
'<p>' + adresse1 + ' ' + cp + ' ' + ville + '</p>' +
'</div>';
var marker = L.marker([latitude, longitude]).addTo(macarte);
marker.bindPopup(content);
}
}
window.onload = function() {
initMap();
};
回答1:
var clusterGroup = new L.MarkerClusterGroup(); // create the new clustergroup
var i;
for (i = 0; i < villes.length; i++) {
var nom = villes[i][0];
var latitude = villes[i][1];
var longitude = villes[i][2];
var adresse1 = villes[i][3];
var cp = villes[i][4];
var ville = villes[i][5];
var content =
'<div>' +
'<h3>' + nom + '</h3>' +
'<p>' + adresse1 + ' ' + cp + ' ' + ville + '</p>' +
'</div>';
var marker = L.marker([latitude, longitude]);
marker.bindPopup(content);
clusterGroup.addLayer(marker); // add marker to the clustergroup
}
macarte.addLayer(clusterGroup); // add clustergroup to the map
来源:https://stackoverflow.com/questions/63110981/leaflet-marker-cluster-automatic