说明
这篇博文主要解决以下几个问题:
1 cesium中绘制气泡弹框
2 气泡弹框可以自由拖动
3 气泡弹框有小尾巴可以定点指向
思路
1 cesium原生自带的Label解决了文字弹框,但是效果不是很理想,因为无法修改样式;
2 cesium原生提供的html嵌入,只是把世界坐标转换为了对应的屏幕坐标,没有办法根据视角距离去显隐控制气泡弹框
3 利用PinBuilder可以做出好的效果,但是文字效果又十分差
为了满足这些功能,所以我采用直接绘制+label标签的形式去解决这些问题

坐标获取
| 方法 | 作用 |
|---|---|
| viewer.camera.pickEllipsoid(movement.position) | |
| viewer.camera.getPickRay(movement.position) | 获取画布上任何地方的世界坐标 |
| viewer.scene.pick(movement.position) | 获取模型信息 |
| viewer.scene.pickPosition(movement.position) | 获取球体上的坐标(但是不包含模型) |
| viewer.scene.drillPick(movement.position, |

本文介绍如何在Cesium中实现自定义样式的气泡弹框,包括自由拖动及指向功能。通过直接绘制与Label标签相结合的方式,解决了原生方法无法满足样式定制和视距控制的问题。
最低0.47元/天 解锁文章
500





