如何在Mapbox GL JS中为3D模型的运动设置动画

Question

Mapbox GL JS文档中的3d model example使我想知道如何为3d车辆在地图上的运动（例如Uber的AVS demo和Cesium）设置动画。

我尝试通过删除当前的3d模型，创建一个新模型然后添加它来修改3d模型示例代码。但是，此周期对于平滑动画而言太慢了：

const moveObject = () => {
  map.removeLayer('3d-model');
  modelOrigin = incrementCoords(modelOrigin);
  modelTransform = createModelTransform(modelOrigin);
  const customLayer = createCustomLayer(modelTransform);
  map.addLayer(customLayer);
};

理想情况下，我希望看到平滑的动画-就像在AVS演示中一样，或在Mapbox GL JS文档中为各种“ line / point / marker”示例制作动画。

Answer 1

对于像这些演示中那样的真实3D用例，最好使用3D工具而不是Mapbox GL JS。它不是3D渲染器，也不是真正的3D，所以这就是您无法获得所需内容的原因。至于Mapbox工具，最好的选择是Maps SDK for Unity。

Unity SDK中有一个示例，说明如何用自定义模型替换3D建筑。您可以在这里找到它：https://docs.mapbox.com/unity/maps/examples/replace-features/