我有一个 Leaflet map ,显示来自 geojson feed 的图钉。我希望能够根据 geojson 中的属性设置自定义图标,该属性可以具有三个值之一,比如绿色、橙色、红色,每个值都有预定义的自定义图标。
如果我设置
return L.marker(latlng, {icon: Red});
它工作正常,但如果我设置
return L.marker(latlng, {icon: feature.icon});
验证了 feature.icon 的值为 Red,它不起作用,并返回“Uncaught TypeError: Cannot read property 'popupAnchor' of undefined”,该行与下面相当多的一行相关,该行将弹出窗口绑定(bind)到层。
我不禁认为这是一个简单的语法错误,但无法确切地弄清楚我应该如何做到这一点。
我尝试了单引号和双引号的各种组合,但没有成功。
更新:感谢下面的评论和回答,我意识到我的想法是错误的。我将图标作为文本值而不是图标对象传递。因此,排序的逻辑是根据 geojson 中存在的文本值进行测试,并使用它来选择和设置适当的图标。
最佳答案
您必须创建所需的所有 L.Icon 对象,并使用 onEachFeature 回调(请参阅 GeoJson )根据 geojson 属性更改标记图标。
function onEachFeature(feature, layer) {
if(feature.properties.icon && feature.properties.icon == "Red") { // Red is the text in the property
layer.setIcon(Red); // Red is the L.Icon object you have created beforehand
}
}
参见example
关于javascript - 在传单中动态设置图标值的语法问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37753315/