cesium显示鼠标经纬度
showLonLats(){
let lonLatDiv = document.createElement('div');
lonLatDiv.id = 'lonLatDiv'
lonLatDiv.style.display = 'block';
lonLatDiv.style.right = '20px'
lonLatDiv.style.paddingRight = '20px'
lonLatDiv.style.marginTop= '-50px'
lonLatDiv.style.zIndex = 999
lonLatDiv.style.position = 'absolute';
let mapDiv = document.getElementById(this.MapDivId)
mapDiv.appendChild(lonLatDiv)
this.handler.setInputAction((e)=>{
var ray = this.viewer.camera.getPickRay(e.endPosition);
if(ray){
var earthPosition = this.viewer.scene.globe.pick(ray, this.viewer.scene);
if(earthPosition){
let ellipsoid = this.viewer.scene.globe.ellipsoid;
let cartographic = ellipsoid.cartesianToCartographic(earthPosition);
let lat = Cesium.Math.toDegrees(cartographic.latitude).toFixed(2);
let lon = Cesium.Math.toDegrees(cartographic.longitude).toFixed(2);
lonLatDiv.innerHTML = lon.toString() +','+ lat.toString()
}
}
}, Cesium.ScreenSpaceEventType.MOUSE_MOVE)
}
效果展示
![在这里插入图片描述](https://i-blog.csdnimg.cn/blog_migrate/9de37e90b470212ad9e2963b50af6a2d.png)