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

倾斜摄影场景的替代实现

倾斜摄影数据是 3D Tiles 最常见的用法:一整片实景模型加上自由环绕的相机。 示例用伪随机的建筑群替代实景模型,重点放在浏览姿态上。

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

这个示例在做什么

8×8 的建筑网格铺在约 1.4 公里的范围内,高度在 12–70 米之间伪随机取值,种子固定, 所以每次打开看到的城市轮廓一致。相机则按时间在中心点周围画圆, 半径 900 米、高度 380 米、俯角 28°,用 camera.setView 每帧更新。

真实项目里不必每帧重建相机,可以用 tileset.boundingSphere 求出范围, 再配合 camera.flyToBoundingSphere 做一次到位;环绕巡检才需要逐帧计算。 这段循环也说明了 3D Tiles 场景常用的视角参数:半径、俯角、朝向。

关键接口

接口作用
Transforms.eastNorthUpToFixedFrame以中心点建立局部坐标系,方便用三角函数算圆上的点
Matrix4.multiplyByPoint把局部坐标换算成地心坐标,作为相机位置
camera.setView立即设置相机位置与姿态,不做飞行动画
box.dimensions建筑体块的尺寸,底面对齐地面

可以直接改的地方

位置改什么效果
radius = 900改成 300贴着街区飞,体块压迫感更强
380(相机高度)改成 1200俯瞰视角,接近总览图
performance.now() * 0.00012改系数环绕速度
8×8 网格循环改成 12×12更密的街区

替代说明:官方示例加载 ion 上的倾斜摄影 3D Tiles 数据集。 本页用建筑体块复现同一浏览场景,相机运动与 tileset 视角控制的写法可直接沿用。