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

让模型自己转起来

模型文件里提前写入了旋转关键帧,加载后由 Cesium 的动画集合驱动, 滑杆能改转速,模型不需要每帧重设矩阵。

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

动画写在模型里

glTF 的 animations 数组包含采样器与通道:采样器声明 时间轴与输出值,通道把输出绑定到某个节点的 rotation 上。 示例把五个四元数关键帧写入二进制块,每 90° 一帧,2.5 秒转一圈。

一个 meshes 被两个节点复用,节点各自带缩放: 一个做轮毂,一个拉成长桨。旋转只作用在长桨节点,视觉上就是转子在转。

播放与调速

模型就绪后调用 activeAnimations.addAll,传入 loop: Cesium.ModelAnimationLoop.REPEAT 让动画循环。 它返回动画对象数组,取第一个改 speed 就能调快慢, 设为 0 相当于暂停。

可调参数

位置改什么效果
转速滑杆0 到 4 倍旋转快慢
quats 的计算改成绕 X 轴转子改为翻滚
times 数组总时长改 5 秒一圈更慢
scale: 70改成 140整体尺寸翻倍

关键帧坐标轴要对应模型的本地轴。glTF 默认 Y 轴向上,示例绕 Y 轴旋转, 导入后正好是绕地垂线转。写成绕 Z 轴,模型会原地打滚而不是平转。