我已经花了好几天的时间试图让它工作。我有一个函数可以根据geojson点的属性(即“Type”)显示geojson点。geojson文件是用jQuery加载的。但是,我无法管理它们的集群,同时保留它们的自定义图标。
我可以通过做一些调整并忽略function geojsonType()
来实现一般的集群,但这不是我所追求的,我陷入了一个恶性循环。
多亏了this post,我可以根据点的属性来显示点。
// create function for pointToLayer when loading geojson
function geojsonType(feature, latlng) {
switch (feature.properties["Type"]) {
case "bar":
var barIcon = new L.icon({
iconUrl: 'images/pub.png', //assign PNG
iconSize: [42, 50], // size of the icon
iconAnchor: [22, 22], // point of the icon which will correspond to marker's location
popupAnchor: [-3, -26] // point from which the popup should open relative to the iconAnchor
});
return L.marker(latlng, { icon: barIcon });
case "recordclothingstore":
var venueIcon = new L.icon({
iconUrl: 'images/venue.png', //assign PNG
iconSize: [42, 50], // size of the icon
iconAnchor: [22, 22], // point of the icon which will correspond to marker's location
popupAnchor: [-3, -26] // point from which the popup should open relative to the iconAnchor
});
return L.marker(latlng, { icon: storeIcon });
case "venueandbar":
var venueandbarIcon = new L.icon({
iconUrl: 'images/pub.png', //assign PNG
iconSize: [42, 50], // size of the icon
iconAnchor: [22, 22], // point of the icon which will correspond to marker's location
popupAnchor: [-3, -26] // point from which the popup should open relative to the iconAnchor
});
return L.marker(latlng, { icon: venueandbarIcon });
}
};
// get geojson
var url = "points.geojson";
$.getJSON(url, function (data) {
pointData.addData(data);
});
// load geojson
var pointData = L.geoJson(null, {
pointToLayer: geojsonType,
onEachFeature: function (feature, layer) {
layer.bindPopup("<a href='" + feature.properties.Website + "'>" + feature.properties.Name + "</a>" + "<br>" + feature.properties.Address + "<br>" + feature.properties.Descriptio);
}
});
然而,下面的代码添加到底部时没有任何效果。控制台中也没有错误。
var clusters = L.markerClusterGroup({
spiderfyOnMaxZoom: true,
showCoverageOnHover: false,
zoomToBoundsOnClick: true
});
clusters.addLayer(pointData);
map.addLayer(clusters);
1条答案
按热度按时间vhmi4jdf1#
我可以命令上面的所有代码使它工作。变量和图标名称可能已经改变,但基本上是相同的代码位。我不知道在哪里放置弹出窗口,虽然。编辑我找到了一个位置的
bindPopup
行。它可以在这里,例如: