CESIUM-视点坐标

项目中有时需要知道鼠标的实时经纬度坐标和高度,具体如下:

前台:

 <div id="cesiumContainer" class="cesium-container">
     <div id="coords">经度:32.000000 度 纬度: 102.000000 度  高度:0 m</div>       
 </div>

css样式:

#coords { /*camera视点坐标*/
    width: 100%;
    height: 33px;
    z-index: 99;
    bottom: 35px;
    color: white;
    user-select: none;
    line-height: 33px;
    text-align: center;
    position: absolute;
    -ms-user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
    -webkit-text-shadow: #000 1px 0 0,#000 0 1px 0,#000 -1px 0 0,#000 0 -1px 0;
    -moz-text-shadow: #000 1px 0 0,#000 0 1px 0,#000 -1px 0 0,#000 0 -1px 0;
    text-shadow: #000 1px 0 0,#000 0 1px 0,#000 -1px 0 0,#000 0 -1px 0;
    *filter: Glow(Color=#000, Strength=1);
    cursor: default;
    /*border: 1px solid red;*/
}

js代码:

var scene = viewer.scene;
    var camera;
    camera = scene.camera;
    scene.screenSpaceCameraController.minimumZoomDistance = -5000;
    var handler;
    function activaEvents(div) {
        handler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
        handler.setInputAction(function (movement) {
            miraPosicio(div);
        }, Cesium.ScreenSpaceEventType.WHEEL);
        handler.setInputAction(function (movement) {
            miraPosicio(div);
        }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
        handler.setInputAction(function (movement) {
            miraPosicio(div);
        }, Cesium.ScreenSpaceEventType.LEFT_UP);
        handler.setInputAction(function (movement) {
            miraPosicio(div);
        }, Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK);
        handler.setInputAction(function (movement) {
            miraPosicio(div);
        }, Cesium.ScreenSpaceEventType.MIDDLE_CLICK);
        handler.setInputAction(function (movement) {
            miraPosicio(div);
        }, Cesium.ScreenSpaceEventType.MIDDLE_CLICK);
        handler.setInputAction(function (movement) {
            miraPosicio(div);
        }, Cesium.ScreenSpaceEventType.PINCH_END);
        handler.setInputAction(function (movement) {
            miraPosicio(div);
        }, Cesium.ScreenSpaceEventType.RIGHT_CLICK);
    }

    function miraPosicio(div) {
        var pos = camera.positionCartographic;
        var x = parseFloat(pos.longitude * (180.0 / Math.PI));
        var y = parseFloat(pos.latitude * (180.0 / Math.PI));
        var z = pos.height;
        document.getElementById(div).innerHTML = '经度:' + x.toFixed(5) + ' 纬度:' + y.toFixed(5) + ' 高度:' + z.toFixed(0) + ' m ';
    }
    activaEvents('coords');

碎碎叨:div的id可根据自己喜好命名,记得修改对应的地方就可以。

转载请注明出处,谢谢!!!

猜你喜欢

转载自blog.csdn.net/qq_27467403/article/details/81134053