首页 / Cesium / 使用示例
视角书签
四个预置视角,加上「保存当前视角」按钮随手记下的新视角。 面板顶部实时显示经纬度、视距和俯仰角。
源码与运行效果
存什么、不存什么
书签里存的是经度、纬度、高度和三个角度,全部是普通数字。
直接存 camera.position(ECEF 坐标)也行,但那个值
与地球半径耦合,换椭球或换场景后不直观,排查问题时也读不出来。
角度存成「度」而不是弧度,是为了让书签能直接放进 JSON、写进数据库、
给人工编辑。恢复时统一走 Cesium.Math.toRadians。
为什么读数要节流
相机每渲染一帧都在变化,如果在 postRender 里直接改 DOM,
一秒会写六十次,既浪费又会让数字闪烁。示例按 200 毫秒节流,
视觉上是连续的,开销降到每秒五次。
可调参数
| 位置 | 改什么 | 效果 |
|---|---|---|
bookmarks 数组 | 增删预置视角 | 面板条目数量与内容 |
duration: 1.6 | 改成 0 | 瞬间切换,没有过渡动画 |
Math.round(高度 / 1000) | 改成保留两位 | 视距读数更精细 |
书签对象里的 roll | 改成非零值 | 画面出现倾斜,用于模拟侧飞 |
| 节流的 200 毫秒 | 改成 50 | 读数刷新更快,DOM 写入更频繁 |
刷新后书签丢失。示例把书签保存在内存里,页面刷新就没了。
需要持久化的场景,把 bookmarks 数组
JSON.stringify 后写进 localStorage,
加载时再 JSON.parse 回来即可,不需要额外依赖。
和业务场景的结合
巡检系统里「保存当前视角」通常和工单绑定:用户找到问题点位,存一个视角, 下次点开工单直接回到现场。这时书签除了相机参数,还要记录当时的图层状态、 时间轴位置,恢复时三者一起还原,否则视角对了但画面内容不对。