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

鼠标拾取经纬度

指针移动时实时显示坐标,单击在地表打点,超过六个时自动淘汰最早的一个。 用的是一次射线与椭球面求交,不依赖地形。

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

坐标是怎么来的

camera.pickEllipsoid 从相机向屏幕上的点发射一条射线, 和光滑椭球面求交。交点是一个三维坐标,再转成 Cartographic 才是人看得懂的经纬高。

因为求交对象是椭球面,这里的高程永远是 0。画面里有地形时, 这个结果会落在山谷表面之下,需要改用 globe.pick(camera.getPickRay(pos), scene) 取真实地表点。

事件绑定的两种写法

事件movement 字段用途
MOUSE_MOVEendPosition实时读数,注意不是 position
LEFT_CLICKposition打点、选中
LEFT_DOWNposition开始拖拽、框选起点
WHEELdelta监听缩放,做层级联动

移动事件如果用错了字段名,回调里拿到 undefined, pickEllipsoid 会直接返回 undefined,表现为读数一直是横线。

可调参数

位置改什么效果
marks.length > 6改成 20保留更多历史点位
label.text改成 lng.toFixed(2)提示文字更短,近距离不互相压盖
flyTo 高度9000000 改成 2000000拉近后拾取精度更高
pickEllipsoid换成 globe.pick有地形时取真实地表高度

拖动地球时会不断打点。左键拖拽也会触发 LEFT_CLICK, 快速拖动之后经常多出一个莫名其妙的点。正式项目里要记录 LEFT_DOWN 的位置,抬起时若位移超过几个像素就当作拖拽, 不执行打点逻辑。

精度说明

屏幕坐标是浮点数,一次求交能给出厘米级的经纬度,但那只代表「射线打在哪」, 不代表数据精度。相机高度在一万公里时,一个屏幕像素对应地面几公里, 读数再精细也毫无意义。做坐标录入功能时,应该同时显示当前视距提示用户。