Javascript 在mapbox上动态更改geojson功能的属性

我使用mapboxgl已经有一段时间了，我需要根据用户的位置更改圆的颜色。圆圈以一种颜色开始，如果用户位于圆圈顶部，它将更改为另一种颜色，并基于用户与应用程序的交互，再次更改颜色

这是我的源和图层数据：

const-pontoscirle=pontos.map（（点路由）=>({
id:pointRoute.order，
键入：“功能”，
属性：{已收集：0，名称：pointRoute.order}，
几何图形：{type:'Point'，坐标：pointRoute.coordinates}
}));
const sourceId='pontos'；
常量源={
键入：“geojson”，
数据：{
类型：“FeatureCollection”，
特征：桥环
}
};
常数层循环={
id:“pontosRota”，
键入：“圆”，
来源：sourceId，
油漆：{
“圆形颜色”：[
“案例”，
['='，['get'，'collected'，0]，
"rgba(235,68,90,8)",，
['='，['get'，'collected'，1]，
"rgba(17,105,54,8)",，
['='，['get'，'collected'，2]，
"ffffff",，
'#000000'
],
“圆笔划宽度”：2，
“圆形笔划颜色”：[
“案例”，
['='，['get'，'collected'，0]，
"rgba(235,68,90,8)",，
['='，['get'，'collected'，1]，
"rgba(17,105,54,8)",，
['='，['get'，'collected'，2]，
"ffffff",，
'#000000'
],
“圆半径”：{
停止：[
[0, 0],
[20，metersToPixelsAtMaxZoom（rota.raioColeta，rota.pontos[0].ponto.coordinations[1]）]
],
基数：2
}
}
};
常数层标签={
id:“pontosRota标签”，
键入：“符号”，
来源：sourceId，
布局：{
“文本字段”：“{name}”，
“文本大小”：14
}
};

这是将图层/源加载到mapbox的代码：

如果（！map.getSource（sourceId））{
map.addSource（sourceId，source）；
}
如果（！map.getLayer（layerCircles.id）和&！map.getLayer（layerLabels.id））{
map.addLayer（layerCircles）；
map.addLayer（图层标签）；
}

---

我尝试了很多可以帮助我更改从数据中收集的属性的例子，但都没有成功。是否每次需要更改数据时都要删除所有层和源，或者是否有其他方法只绘制一个圆？

我认为Mapbox GL JS中GeoJSON源可用的

setData（）

方法就是您要寻找的。该方法允许您更新基础源数据并触发贴图重新渲染。然后，数据驱动的样式应该启动，并根据需要设置更新层的样式

下面是一个伪代码示例

map.getSource（“source id”）.setData（updategeojsondata）；

我正在整理一本Mapbox开发者手册，其中包括关于这类东西的指南。它还没有完成，但你可以跟踪更新，并在发布时得到通知