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

模型关节摆动

把两段模型拼成一个会摆动的机械臂:底座固定,摆臂绕底座顶部的铰点往复转动。 关节角完全由代码计算,不依赖模型里烘焙好的动画。

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

这个示例在做什么

两段模型各有自己的 modelMatrix。底座直接用该点的「东-北-天」矩阵; 摆臂用铰点矩阵,即 enu × 平移(0, 0, 6) 的结果。 每一帧再把绕 X 轴的旋转矩阵右乘到铰点矩阵上,摆臂就以自身底面为轴转动。

关键在于右乘而不是左乘。pivot × R 表示「先旋转自身,再摆到铰点」, 所以摆臂绕的是自己的根部;写成 R × pivot 会绕世界原点转,摆臂会飞出画面。

关键接口

接口作用
Matrix4.fromTranslation(cartesian)构造纯平移矩阵,用来把铰点从地面抬到 6 米高
Matrix3.fromRotationX(angle)绕 X 轴(东西方向)旋转,正负决定摆动方向
Matrix4.multiply(a, b, result)矩阵级联,第二个参数传入复用对象可避免每帧新建对象
Promise.all([...])两段模型同时加载,都就绪后再挂到场景里

可以直接改的地方

位置改什么效果
Math.sin(… * 0.0012) * 1.1改系数 0.0012(速度)与 1.1(幅度)摆动快慢与张角
fromRotationX 改成 fromRotationY换旋转轴摆臂改成左右横扫
Cesium.Cartesian3(0, 0, 6)换铰点高度关节位置上下移动
boxGlb(1.4, 7, 1.4, …)改摆臂长度力臂变长,视觉幅度更明显

替代说明:官方示例加载的模型在 glTF 里带了 articulations 节点动画。 这里没有外部模型可用,于是把两段模型当父子节点处理,用矩阵级联手算出同样的关节旋转; 若换成真正带 articulation 的模型,可改用 model.getNode(name).matrix 驱动同一节点。