Cesium中实时显示经纬度及视角高

如何在cesium中实时根据鼠标的位置显示经纬度以及视角高

具体效果如下：

具体代码如下：

//html代码

[html] view plain copy print ?

1. <span style="font-size:24px;"><div id="latlng_show" style="width:340px;height:30px;position:absolute;bottom:40px;right:200px;z-index:1;font-size:15px;">  
2.   <div style="width:100px;height:30px;float:left;">  
3.        <font size="3" color="white">经度：<span id="longitude_show"></span></font>  
4.   </div>  
5.   <div style="width:100px;height:30px;float:left;">  
6.        <font size="3" color="white">纬度：<span id="latitude_show"></span></font>  
7.   </div>  
8.   <div style="width:140px;height:30px;float:left;">  
9.        <font size="6" color="white">视角高：<span id="altitude_show"></span>km</font>  
10.   </div>  
11. </div></span>  

[html] view plain copy print ?

1. <strong><span style="font-size:32px;">//相应的js代码</span></strong>  

[javascript] view plain copy print ?

1. <span style="font-size:24px;"><!-- 经纬度实时显示 -->  
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(4);  
17.                     var log_String=Cesium.Math.toDegrees(cartographic.longitude).toFixed(4);  
18.                     var alti_String=(viewer.camera.positionCartographic.height/1000).toFixed(2);  
19.                     longitude_show.innerHTML=log_String;  
20.                     latitude_show.innerHTML=lat_String;  
21.                     altitude_show.innerHTML=alti_String;  
22.                }  
23.         },Cesium.ScreenSpaceEventType.MOUSE_MOVE);</span>