cesium绑定点击事件，并获取并点击坐标实现方法

一、事件绑定介绍

二维里面地图上绑定事件的方式是on：map.on('mousedown', function (e) {

     console.log(e);

});

在三维里面没有 map，它的事件绑定在Viewer上，首先创建handler 。

this.handler = new Cesium.ScreenSpaceEventHandler(gViewer.scene.canvas);

上述代码创建了一个屏幕控制实例，控制cesium的canvas ；  gViewer 是项目中的viewer；

Cesium官网里面ScreenSpaceEventHandler提供了五个方法，分别是：

setInputAction (action, type, modifier )；

removeInputAction (type, modifier )；

getInputAction (type, modifier )

destroy ()；

isDestroyed () → Boolean；

加粗的两个方法是项目中常用的，下面列上用法：type表示绑定/解绑事件种类，isAdd用于判断绑定/解绑；

// 操作地图事件
            handlerCesium (type,isAdd = true) {
                if(isAdd) {
                    switch (type) {
                        case "onDown":
                            _this.handler.setInputAction(_this.onDown,Cesium.ScreenSpaceEventType.LEFT_DOWN);
                            break;
                        case "onMove":
                            _this.handler.setInputAction(_this.onMove,Cesium.ScreenSpaceEventType.MOUSE_MOVE);
                            break;
                        case "onUp":
                            _this.handler.setInputAction(_this.onUp,Cesium.ScreenSpaceEventType.LEFT_UP);
                            break;
                    }
                } else {
                    switch (type) {
                        case "onDown":
                            _this.handler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_DOWN);
                            break;
                        case "onMove":
                            _this.handler.removeInputAction(Cesium.ScreenSpaceEventType.MOUSE_MOVE);
                            break;
                        case "onUp":
                            _this.handler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_UP);
                            break;
                    }
                }
            },

二、获取点击坐标

 以onDown事件举例：

onDown (movement) {
    let point;
    let windowPosition = gViewer.camera.getPickRay(movement.position); 
    let cartesionCordinations = gViewer.scene.globe.pick(windowPosition,gViewer.scene);
    point = mapDraw3D.posiTransform(cartesionCordinations);
},

三、posiTransform是把点从笛卡尔坐标转为地理数据类型的经纬度

posiTransform: function (posi) {
    //转坐标
    if (posi) {
        var ellipsoid = gViewer.scene.globe.ellipsoid;
        var cartographic = ellipsoid.cartesianToCartographic(posi);
        var lng = Cesium.Math.toDegrees(cartographic.longitude);
        var lat = Cesium.Math.toDegrees(cartographic.latitude);
        var position = [lng, lat]
        return position
    }
},