我使用Leaflet和GeoJSON构建了一个网络地图。我想更改标记,但是Leaflet网站的示例对我没有帮助,因为它用于本地文件。知道如何更改吗?
$.getJSON("https://gist.githubusercontent.com/vassilaros/3791204ca226d5b236b4cd3106ef23cf/raw/PicnicSites.geojson", function(data) { addDataToMap(data, map); });
和
function addDataToMap(data, map) {
var dataLayer = L.geoJson(data, {
onEachFeature: function(feature, layer) {
var popupText = "Name: " + feature.properties.Name
+ "<br>Location: " + feature.properties.place
+ "<br><a href='" + feature.properties.url + "'>More info</a>";
layer.bindPopup(popupText); }
});
dataLayer.addTo(map);
}
编辑:
为便于说明,我想添加以下标记
var MyIcon = L.icon({
iconUrl: 'leaf-green.png',
iconSize: [38, 95], // size of the icon
shadowSize: [50, 64], // size of the shadow
iconAnchor: [22, 94], // point of the icon which will correspond to marker's location
shadowAnchor: [4, 62], // the same for the shadow
popupAnchor: [-3, -76] // point from which the popup should open relative to the iconAnchor
});
,我想将{icon: greenIcon}
添加到我的图层。
我必须添加这一行代码吗?
EDIT2:
答案 0 :(得分:2)
只需使用pointToLayer函数
var MyIcon = L.icon({
iconUrl: 'leaf-green.png',
iconSize: [38, 95], // size of the icon
shadowSize: [50, 64], // size of the shadow
iconAnchor: [22, 94], // point of the icon which will correspond to marker's location
shadowAnchor: [4, 62], // the same for the shadow
popupAnchor: [-3, -76] // point from which the popup should open relative to the iconAnchor
});
L.geoJson(data ,{
pointToLayer: function(feature,latlng){
return L.marker(latlng,{icon: MyIcon});
}
}).addTo(map);