我在标记集群工作并显示集群中的项目数时遇到问题,但是图标不显示。当我放大时,会显示单个图标,但从远处看,群集图标不会显示。这是我在集群中设置数据的代码:
// Marker cluster
var producerLayer = new L.MarkerClusterGroup();
// Loop through the lp array
for (var i=0; i < lp.length; i++) {
var name = lp[i][0];
var place = lp[i][1];
var lat = lp[i][2];
var lng = lp[i][3];
var liscence = lp[i][4];
var risk = lp[i][5];
var icon = greenIcon;
var markerLocation = new L.LatLng(lat, lng);
var marker = new L.Marker(markerLocation, {icon});
var content = '<div class="info_content">' +
'<h3>' + name + '</h3>' +
'<p>' + place + '</p>' +
'<p>' + 'Date of initial liscencing: ' + liscence + '</p>' +
'<p>' + 'Risk rating: ' + risk + '</p>';
producerLayer.addLayer(marker);
marker.bindPopup(content).openPopup();
}
producerLayer.addTo(map);
我在下面附上了我遇到的问题的图片。
最佳答案
看起来您只是缺少 Leaflet.markercluster 插件 CSS files ,如 plugin docs 中所述:
[…] use files in the
dist
folder:
MarkerCluster.css
MarkerCluster.Default.css
(not needed if you use your owniconCreateFunction
instead of the default one)leaflet.markercluster.js
(orleaflet.markercluster-src.js
for the non-minified version)
例如使用
unpkg.com
CDN:<link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster@1.3.0/dist/MarkerCluster.css">
<link rel="stylesheet" href="https://unpkg.com/leaflet.markercluster@1.3.0/dist/MarkerCluster.Default.css">
关于传单标记群集图标未显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49863715/