cesium 显示视角高度以及鼠标经纬度

HTML中的内容

 1 <div id="cesiumContainer">
 2     <!-- 设置经纬度显示 -->
 3     <span style="font-size:24px;">
 4         <div id="latlng_show" style="450px;height:30px;position:absolute;bottom:40px;right:400px;z-index:1;font-size:15px;">
 5             <div style="120px;height:30px;float:left;">
 6                 <font size="3" color="white">经度:
 7                     <span id="longitude_show"></span>°
 8                 </font>
 9             </div>
10             <div style="120px;height:30px;float:left;">
11                 <font size="3" color="white">纬度:
12                     <span id="latitude_show"></span>°
13                 </font>
14             </div>
15             <div style="210px;height:30px;float:left;">
16                 <font size="3" color="white">视角高:
17                     <span id="altitude_show"></span>km</font>
18             </div>
19         </div>
20     </span>
21     <script>
22 
23     </script>
24 </div>

js中的内容

 1  // 设置鼠标位置经纬度视角高度实时显示
 2     var longitude_show=document.getElementById('longitude_show');  
 3     var latitude_show=document.getElementById('latitude_show');  
 4     var altitude_show = document.getElementById('altitude_show');
 5     var canvas = viewer.scene.canvas;
 6     //具体事件的实现  
 7     var ellipsoid = viewer.scene.globe.ellipsoid;
 8     var handler = new Cesium.ScreenSpaceEventHandler(canvas);
 9     handler.setInputAction(function (movement) {
10         //捕获椭球体,将笛卡尔二维平面坐标转为椭球体的笛卡尔三维坐标,返回球体表面的点  
11         var cartesian = viewer.camera.pickEllipsoid(movement.endPosition, ellipsoid);
12         if (cartesian) {
13             //将笛卡尔三维坐标转为地图坐标(弧度)  
14             var cartographic = viewer.scene.globe.ellipsoid.cartesianToCartographic(cartesian);
15             //将地图坐标(弧度)转为十进制的度数  
16             var lat_String = Cesium.Math.toDegrees(cartographic.latitude).toFixed(2);
17             var log_String = Cesium.Math.toDegrees(cartographic.longitude).toFixed(2);
18             // 获取相机的海拔高度作为视角高度/km
19             alti_String = (viewer.camera.positionCartographic.height / 1000).toFixed(2);
20             longitude_show.innerHTML = log_String;
21             latitude_show.innerHTML = lat_String;
22             altitude_show.innerHTML = alti_String;
23         }
原文地址:https://www.cnblogs.com/dongzhiwu/p/9216403.html