cesium 如何使实体平滑更新位置

最新推荐文章于 2026-07-20 13:09:34 发布

原创

最新推荐文章于 2026-07-20 13:09:34 发布 · 9.9k 阅读

收录于

当前文章被以下社区和专栏收录：

本文介绍了在Cesium中如何避免实体更新位置时出现闪烁现象，提供了直接赋值和回调函数两种方法。直接赋值可能导致闪烁，而通过CallbackProperty实现的回调函数更新能实现平滑过渡。示例代码展示了如何平滑地更新多边形和点的位置，适用于需要连续更新的3D场景。

如果需要不断更新实体位置，实现平滑过渡的效果可以借鉴该方式，两种方式实现，一是直接赋值新坐标位置，但有时会出现闪烁情况；这里推荐第二种，通过回调函数的方式更新位置

1 直接赋值方式

直接赋值方式：cesium绘制原理是先移除，然后在新位置渲染，依次反复；

效果如下

可以看到明显缺点:频闪；表现为无有无有....，如果轮询间隔短，甚至出现消失的效果

import {
    Viewer,
    Cartesian3,
    Color,
    PolygonHierarchy,
    CallbackProperty
} from 'cesium'
import "cesium/Build/Cesium/Widgets/widgets.css"
import viewOption from './viewerOption';
var V = new Viewer('gisContainer', viewOption);
document.getElementsByClassName('cesium-viewer-bottom')[0].style.display = "none"
// 定义一个实体
var PolygonEntity = V.entities.add({
    name: 'Green extruded polygon',
    polygon: {
      hierarchy: Cartesian3.fromDegreesArray([
        -118.0,
        46.0,
        -100.0,
        46.0,
        -94.0,
        40.0
      ]),

标签