传单 - 更改标记节点图标

Question

这是我的 GeoJSON 点：

{
  "type": "Feature",
  "geometry": {
    "type": "Point",
    "coordinates": [
      "-83.882517",
      "32.55514717"
    ]
  },
  "properties": {
    "popupContent": "\u003cb\u003eStart OS:(2018-01-25-06.10.46.140000 )\u003c/b\u003e\u003cbr/\u003e(-83.882517, 32.55514717)\u003cbr/\u003e",
    "style": {
      "radius": 8,
      "weight": 1,
      "color": "#000033",
      "fillColor": "#FFFF00",
      "opacity": 1,
      "fillOpacity": 1
    },
    "icon": null
  },
  "id": 5001
},

现在，如您所见，元素有 "icon": null。如何访问特定元素并更改其图标（使用 XXX.setIcon(trainIcon); 之类的东西）？

我不明白如何访问单个元素并更改其某些值。所有的特征点都是同一层的一部分。

谢谢！

Answer 1

如果我没理解错的话，你有 GeoJSON 数据，你可以通过将其提供给 L.geoJSON 工厂来显示在 Leaflet 地图上。

但在某些情况下，您的 GeoJSON 数据未在要素属性中指定正确的 icon，因此您想修改这些。

当然，理想的情况是事先修复您的 GeoJSON 数据，而不是尝试在运行时修复这种情况。但是如果由于某种原因你不能修改 GeoJSON 数据，你仍然有几种可能的 Leaflet 解决方案：

使用L.geoJSON工厂的onEachFeature选项，测试feature.properties.icon是否不正确，然后重新分配标记图标。
使用你已经创建的L.geoJSON层组的eachLayer方法，测试layer.feature.properties.icon是否不正确，然后重新分配标记图标。

由于您的功能也有一个 ID，如果您知道需要返工的功能的 ID，您也可以测试此 ID 而不是 properties.icon。

Answer 2

虽然理想情况下，您至少会将 geoJSON 配置为 return 初始图标，但您可以通过跟踪集合中的 L.marker 对象，然后调用 [=12] 来处理此问题=] 当你需要更新图标时。

假设您这样创建标记：

const myMarker = L.marker(latlng, {
            'icon': L.icon({
              iconUrl: /example.png
              iconSize: [37, 37],     
              iconAnchor: [18, 37],    correspond to marker's location
            })
          }).addTo(myMap);

然后您可以在您的计时器事件上调用 myMarker.setIcon(newIcon)。

传单 - 更改标记节点图标

leaflet - Changing marker node icon

javascript

icons

image

geojson

leaflet