首页 / Cesium / 使用示例
HTML 浮层标注
把世界坐标换算成画布坐标,让普通网页元素跟着三维场景移动。
源码与运行效果
坐标换算
cartesianToCanvasCoordinates 返回画布内的像素坐标,超出视锥或在地球背面时返回 undefined,用它控制浮层的显示与隐藏。
为什么用 DOM
网页元素能放任意 HTML、响应点击、用 CSS 做动画。三维场景里的标注做不到这些,用浮层叠加是常见做法,代价是每帧要同步一次位置。
| 接口 | 返回值 | 说明 |
|---|---|---|
cartesianToCanvasCoordinates | Cartesian2 / undefined | 世界坐标转画布像素 |
preRender | 事件 | 在渲染前更新位置 |
scene.canvas.clientWidth | 像素 | 画布 CSS 宽度 |
浮层没有深度信息,被建筑挡住时依然显示在最上层;需要真实遮挡时应改用实体标注。