经纬志
首页 / Cesium / 使用示例

用 CZML 播放一条飞行动画

五个航点串成一条航线,物体沿路线移动并自动画出轨迹。数据全部内联在页面里,不依赖任何外部文件。

CesiumJS 1.121 · 更新 2026-10-27
源码与运行效果
运行效果

CZML 的时间采样怎么排

position.cartographicDegrees 是一个扁平数组,第一个数是相对 epoch 的秒数,后面每三项是一组「经度、纬度、高度」。 两个采样点之间的位置由 Cesium 插值,不需要自己补点。

position: {
  epoch: '2026-01-01T00:00:00Z',
  cartographicDegrees: [
    0,   116.39, 39.90, 120000,   // 第 0 秒:北京
    45,  121.47, 31.23, 120000,   // 第 45 秒:上海
    90,  113.26, 23.12, 120000,   // 第 90 秒:广州
    135, 104.06, 30.57, 120000,   // 第 135 秒:成都
    180, 87.61,  43.82, 120000    // 第 180 秒:乌鲁木齐
  ]
}

时间轴由 clock 驱动

CZML 只描述「什么时候在哪里」,真正推进时间的是 viewer.clock。 必须把 startTime、stopTime、currentTime 设成和 CZML 一致,并打开 shouldAnimate,否则画面静止不动。 multiplier 是倍速,示例里设为 12 表示十二倍速播放。

动画不动?检查三件事:clock.shouldAnimate 是否为 true、 availability 的时间范围是否覆盖当前时间、Viewer 是否开了 requestRenderMode(开了就要每帧手动请求渲染)。

path 属性会自动把物体走过的位置连成线,resolution 控制采样的时间间隔,单位秒。设得太小会生成大量点,长航线建议用默认值。