Cesium中如何将相机绑定到飞行移动的模型？

嘿，我来帮你搞定这个相机绑定模型的需求！Cesium本身确实没有直接提供bindToModel这种开箱即用的方法，但我们可以通过两种靠谱的思路来实现相机随模型同步移动的效果，下面给你详细拆解：

方法一：手动实时同步相机姿态 #

这种方法适合你已经用primitives.add添加模型的场景，核心思路是监听每一帧的模型位置变化，实时计算并更新相机的位置和朝向。

首先你需要定义相机相对于模型的初始偏移（比如你想让相机在模型后方50米、上方10米的位置，保持向下看向模型的视角），然后通过帧循环事件来同步：

// 定义相机相对于模型局部坐标系的偏移量（后50米，上10米）
const cameraOffset = new Cesium.Cartesian3(-50.0, 0.0, 10.0);
let model;

// 初始化你的模型（和你原来的代码一致）
const modelMatrix = Cesium.Transforms.eastNorthUpToFixedFrame(
    Cesium.Cartesian3.fromDegrees(longitude, latitude, altitude)
);
model = this.viewer.scene.primitives.add(Cesium.Model.fromGltf({ 
    url: URL, 
    modelMatrix: modelMatrix, 
    minimumPixelSize: 1, 
    maximumScale: 1 
}));

// 创建帧更新函数，同步相机到模型
function syncCameraToModel() {
    if (!model?.modelMatrix) return;

    // 把相机的局部偏移转换为世界坐标系位置
    const worldCameraPos = Cesium.Matrix4.multiplyByPoint(
        model.modelMatrix, 
        cameraOffset, 
        new Cesium.Cartesian3()
    );
    // 获取模型原点的世界坐标
    const modelWorldPos = Cesium.Matrix4.getTranslation(
        model.modelMatrix, 
        new Cesium.Cartesian3()
    );

    // 设置相机位置和朝向，始终看向模型
    this.viewer.camera.setView({
        destination: worldCameraPos,
        orientation: {
            heading: Cesium.Math.toRadians(0), // 可根据模型朝向调整
            pitch: Cesium.Math.toRadians(-15), // 向下15度看向模型
            roll: 0.0
        }
    });

    // 持续监听下一帧
    requestAnimationFrame(syncCameraToModel.bind(this));
}

// 启动同步
syncCameraToModel.bind(this)();

之后你只需要正常修改model.modelMatrix来让模型飞行，相机会自动跟着同步视角。

方法二：用Entity实现自动追踪（更简洁） #

如果你能把模型转为Cesium Entity来管理，那可以直接利用Entity的内置追踪能力，代码更简洁：

// 创建包含模型的Entity
const modelEntity = this.viewer.entities.add({
    position: Cesium.Cartesian3.fromDegrees(longitude, latitude, altitude),
    model: {
        uri: URL,
        minimumPixelSize: 1,
        maximumScale: 1
    },
    // 设置相机相对于模型的视角（局部坐标系偏移）
    viewFrom: new Cesium.Cartesian3(-50.0, 0.0, 10.0)
});

// 绑定相机到这个Entity，自动追踪
this.viewer.trackedEntity = modelEntity;

// 模拟模型飞行：更新Entity的position即可
setInterval(() => {
    const currentTime = this.viewer.clock.currentTime;
    const currentPos = modelEntity.position.getValue(currentTime);
    // 让模型沿X轴移动（可根据需求修改飞行路径）
    const newPos = Cesium.Cartesian3.add(
        currentPos, 
        new Cesium.Cartesian3(10, 0, 0), 
        new Cesium.Cartesian3()
    );
    modelEntity.position = newPos;
}, 100);

这种方法下，Cesium会自动处理相机的姿态同步，甚至模型旋转时相机也会跟着调整视角，完美贴合“绑定”的需求。

额外注意点 #

• 如果你的模型有自身的骨骼动画（比如飞机螺旋桨转动），第一种方法需要用model.convertLocalToWorldCoordinates来计算更准确的相机位置，避免偏移错误。
• 第二种方法中，viewFrom的偏移是基于模型的局部坐标系，所以模型自身旋转时，相机视角会自动适配，体验更自然。

内容的提问来源于stack exchange，提问作者Sasha Kos