Mapbox GL JS-setData

Question

我正在使用setData URL来改善MapBox性能：

(source as GeoJSONSource).setData('http://localhost:8888/api/tracking/all');

但是，API并未发送MapBox可直接读取的GeoJson。因此，为了避免更新后端部分，我想在前端进行一些转换。

但是我找不到解决办法，你有什么主意吗？

我尝试过此方法，但不起作用：

(source as GeoJSONSource).setData('http://localhost:8888/api/tracking/all').map(this.aisDataService.transformBackend)

预先感谢您的帮助。

达米恩

Answer 1

由于方法setData要求使用正确的geo-json作为对象或具有正确的geo-json的URL行，因此您需要：

1）获取远程json 2）将其转换为geo-json 3）setData

the axios library的示例：

  axios
    .get(remoteDataURL)
    .then(function(res) {
      var geojson = {
        "type": "FeatureCollection",
        "features": res.data.map(transformBackend)
      }
      map.getSource('data').setData(geojson)
    })

[https://jsfiddle.net/97wq4L0f/]