首页 / Cesium / 使用示例
悬停高亮与检查面板
检查器的价值在于「指哪查哪」。悬停高亮加属性面板,二三十行代码就能搭出雏形。
源码与运行效果
这个示例在做什么
鼠标悬停在建筑上,该建筑描边变成蓝色,右侧面板显示编号、经纬度、高度与底面积。 移开就恢复原样,面板淡下去。
检查器类的工具都遵循这个模式:悬停拾取 → 记录上一个高亮对象 → 切换高亮 → 展示属性。要注意「恢复上一个对象」这一步,否则高亮会一路累积。 3D Tiles 的检查器还会显示瓦片层级、几何误差等调试字段,取值方式相同。
关键接口
| 接口 | 作用 |
|---|---|
MOUSE_MOVE | 悬停事件,回调里用 endPosition |
box.outlineColor | 改描边色做高亮,比换材质更轻 |
tile._geometricError 等 | 真实瓦片的调试字段(仅供排查) |
scene.pick | 每分钟数百次调用,注意不要在回调里做重活 |
可以直接改的地方
| 位置 | 改什么 | 效果 |
|---|---|---|
#4d9bff | 换成告警红 | 高亮配色 |
properties | 加字段 | 面板多一行 |
MOUSE_MOVE | 改成 LEFT_CLICK | 点击才显示,不随鼠标扫过变化 |
panel.style.opacity | 调整数值 | 未选中时的面板淡化程度 |
替代说明:官方示例使用 Cesium 的瓦片检查器查看 ion 数据的内部结构。 这里用实体属性复现「悬停高亮 + 属性面板」的交互,字段换成瓦片调试值即可。