Mapbox GL setDataで複数のマーカーでレイヤーを更新する

Question

マップボックスGLマップには、単一のレイヤーとそのレイヤーに複数のマーカーがあり、特定のマーカーを更新しようとしていますので、setDataを使用してマーカーを1つだけ更新しますsetDataは、レイヤーマーカー全体をリセットして、レイヤー全体の単一マーカーとして更新しようとしているものだけを追加し、すべての古いマーカーを削除します。私の下に示すようにGeoJSONオブジェクトの配列としてにGeoJSON形式で複数のマーカーを追加しようとすることで

は、エラーを取得する：

Uncaught Error: Input data is not a valid GeoJSON object. 

コード：誰か場合

  map.getSource('cafespots').setData([{ 
      "type": "Feature", 
      "geometry": { 
       "type": "Point", 
       "coordinates": [31.331849098205566, 30.095422632059062] 
      }, 
      "properties": { 
       "marker-symbol": "cafe" 
      } 
      },{ 
      "type": "Feature", 
      "geometry": { 
       "type": "Point", 
       "coordinates": [31.39, 30.10] 
      }, 
      "properties": { 
       "marker-symbol": "cafe" 
      } 
      }]); 

はあまりそれを感謝します

Answer 1

setDataは完全なGeoJSONオブジェクト（機能だけでなく）を期待しています。またはGeoJSONオブジェクトを指すURL。

コード内のGeoJSONの状態を管理し、変更が行われたときにsetDataによってオブジェクト全体を更新する必要があります。

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

map.on('load', function() { 
    map.addSource('custom', { 
    "type": "geojson", 
    "data": geojson 
    }); 

    // Add a marker feature to your geojson object 
    var marker { 
    type: 'Feature', 
    geometry: { 
     type: 'Point', 
     coordinates: [0, 0] 
    } 
    }; 

    geojson.features.push(marker); 
    map.getSource('custom').setData(geojson); 
}); 

https://www.mapbox.com/mapbox-gl-js/example/measure/は、この動作を示す良い例です。