Question

我有一系列标记，我希望每个标记都有一个特定的id，以便我可以调用每个标记并自行设置动画。

我有这个将它们添加到地图中：

map.addSource('markers', {
    "type": "geojson",
     "data": geojson
});

map.addLayer({
    "id": "markers",
     "type": "symbol",
     "source":"markers",
     "layout": {
         "icon-image": "airport-15",
         "text-field": "{title}",
         "text-font": ["Open Sans Semibold", "Arial Unicode MS Bold"],
          "text-offset": [0, 0.6],
          "text-anchor": "top"
       }
});

数据来自这个geojson，它正在从函数中的文件中填充，它正在工作：

var geojson = {
    type: 'FeatureCollection',
    features: []
};

每种标记都采用以下格式：

var marker = {
      type: 'Feature',
       geometry: {
           type: 'Point',
           coordinates: coordinate
       },
       properties: {
            title: key,
            description: '',
       }
 }

Answer 1

基本上我将所有GeoJSON数据添加到我调用的字典中：

markers = {}

然后，我在这本词典中填入了所有标记数据，为每个标记数据提供了唯一的ID。这将使我无需使用两个for循环来检查WHICH标记是否已更新（意味着它在原始数组和更新的标记数组中），并且还可以更容易地更新值（以完成标记的动画）从原来的位置到更新的位置。

geojson.features = Object.values(markers);
map.getSource('markers').setData(geojson);

如果您找到另一种方法可以轻松找到GeoJSON数组中的对象，请分享！

Mapbox GL - 添加具有特定ID的标记

1 个答案: