Cesium 三维球转动监听事件（相机监听事件）并且获取当前中心点位置

三维球转动监听，可以使用相机监听，也可以使用鼠标移动监听。

相机监听有延迟，必须转动到一定程度后，才会启动监听。

鼠标移动监听可以实时监听

/* 三维球转动添加监听事件 */
viewer.camera.changed.addEventListener(function (percentage) {
    // 打印中心点坐标、高度
    console.log(getCenterPosition());
});
​
/* 获取camera中心点坐标 */
function getCenterPosition() {
  var result = viewer.camera.pickEllipsoid(new Cesium.Cartesian2(viewer.canvas.clientWidth / 2, viewer.canvas
    .clientHeight / 2));
  var curPosition = Cesium.Ellipsoid.WGS84.cartesianToCartographic(result);
  var lon = curPosition.longitude * 180 / Math.PI;
  var lat = curPosition.latitude * 180 / Math.PI;
  var height = getHeight();
  return {
    lon: lon,
    lat: lat,
    height: height
  };
}
​
/* 获取camera高度  */
function getHeight() {
  if (viewer) {
    var scene = viewer.scene;
    var ellipsoid = scene.globe.ellipsoid;
    var height = ellipsoid.cartesianToCartographic(viewer.camera.position).height;
    return height;
  }
}
​

cesium设置三维球的视角位置

设置三维球的视角和位置主要使用两个函数，一个是setView一个是flyTo。

setView： 三维球立即转到对应的视角和位置上。（无延迟） flyTo： 通过转动的动画，三维球转到对应的视角和位置上。（有延迟）

viewer.camera.setView({
    // fromDegrees()方法，将经纬度和高程转换为世界坐标
    destination:Cesium.Cartesian3.fromDegrees(117.48,30.67,15000.0),
    orientation:{
    // 指向
    heading:Cesium.Math.toRadians(90,0),
    // 视角
    pitch:Cesium.Math.toRadians(-90),
    roll:0.0
    }
});
​
viewer.camera.flyTo({
    // fromDegrees()方法，将经纬度和高程转换为世界坐标
    destination:Cesium.Cartesian3.fromDegrees(117.48,30.67,15000.0),
    orientation:{
    // 指向
    heading:Cesium.Math.toRadians(90,0),
    // 视角
    pitch:Cesium.Math.toRadians(-90),
    roll:0.0
    }
});
​

如何获取中心点看上一目录

Cesium场景内的鼠标点击事件汇总

**

Cesium鼠标点击事件主要有如下几种：

        var viewer = new Cesium.Viewer('cesiumContainer', {
            //加载天地图影像地图，WebMapTileServiceImageryProvider该接口是加载WMTS服务的接口
            imageryProvider: new Cesium.WebMapTileServiceImageryProvider({
            animation: false, //是否显示动画控件
            shouldAnimate: true,
            homeButton: false, //是否显示Home按钮
            fullscreenButton: false, //是否显示全屏按钮
            baseLayerPicker: false, //是否显示图层选择控件
            geocoder: false, //是否显示地名查找控件
            timeline: false, //是否显示时间线控件
            sceneModePicker: true, //是否显示投影方式控件
            navigationHelpButton: false, //是否显示帮助信息控件
            infoBox: false, //是否显示点击要素之后显示的信息
            requestRenderMode: true, //启用请求渲染模式
            scene3DOnly: false, //每个几何实例将只能以3D渲染以节省GPU内存
            sceneMode: 3, //初始场景模式 1 2D模式 2 2D循环模式 3 3D模式  Cesium.SceneMode
            //加载谷歌影像地图，UrlTemplateImageryProvider该接口是加载谷歌地图服务的接口
                url: 'http://t0.tianditu.gov.cn/img_w/wmts?tk=ebf64362215c081f8317203220f133eb',
                layer: 'img',
                style: 'default',
                tileMatrixSetID: 'w',
                format: 'tiles',
                maximumLevel: 18
            })
        });
        //定义canvas屏幕点击事件，scene.canvas指的是HTMLCanvasElement元素，也就是屏幕画的东西
        var handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);
        
            //注册鼠标事件
            handler.setInputAction(function () {
                alert("点击了左键")
            }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
            handler.setInputAction(function () {
                alert("点击了中键")
            }, Cesium.ScreenSpaceEventType.MIDDLE_CLICK);
            handler.setInputAction(function () {
                alert("双击了左键")
            }, Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK);
            
            // 其他鼠标点击事件还有
            // Cesium.ScreenSpaceEventType.LEFT_CLICK 左键点击事件
            // Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK 左键双击事件
            // Cesium.ScreenSpaceEventType.LEFT_DOWN 左键按下事件
            // Cesium.ScreenSpaceEventType.LEFT_UP 左键抬起事件
            // Cesium.ScreenSpaceEventType.MIDDLE_CLICK 滚轮点击
            // Cesium.ScreenSpaceEventType.MIDDLE_DOWN 滚轮按下
            // Cesium.ScreenSpaceEventType.MIDDLE_UP 滚轮抬起
            // Cesium.ScreenSpaceEventType.MOUSE_MOVE 鼠标移动
            // Cesium.ScreenSpaceEventType.PINCH_END 两指按下结束
            // Cesium.ScreenSpaceEventType.PINCH_MOVE 两指移动
            // Cesium.ScreenSpaceEventType.PINCH_START 两指开始触碰
            
        handler.setInputAction(function () {
            //取消所有鼠标的点击事件
            // handler.destroy()  
            //取消鼠标某个点击事件，如下是取消右键，也可以为左键或者鼠标移动事件
            handler.removeInputAction(Cesium.ScreenSpaceEventType.RIGHT_CLICK);  
            alert("点击了右键，右键取消了，其他的还在")
        }, Cesium.ScreenSpaceEventType.RIGHT_CLICK);
        
        handler.setInputAction(function () {
            //取消所有鼠标的点击事件
            handler.destroy()  
            alert("双击了右键，取消全部事件")
        }, Cesium.ScreenSpaceEventType.RIGHT_DOUBLE_CLICK);
​
​

其他鼠标点击事件

//左键点击
Cesium.ScreenSpaceEventType.LEFT_CLICK
//左键双击
Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK
//左键按下
Cesium.ScreenSpaceEventType.LEFT_DOWN
//左键抬起
Cesium.ScreenSpaceEventType.LEFT_UP
//右键单击
Cesium.ScreenSpaceEventType.RIGHT_CLICK : 
//右键按下
Cesium.ScreenSpaceEventType.RIGHT_DOWN : 
//右键抬起
Cesium.ScreenSpaceEventType.RIGHT_UP
//滚轮点击
Cesium.ScreenSpaceEventType.MIDDLE_CLICK
//滚轮按下
Cesium.ScreenSpaceEventType.MIDDLE_DOWN
//滚轮抬起
Cesium.ScreenSpaceEventType.MIDDLE_UP
//鼠标移动
Cesium.ScreenSpaceEventType.MOUSE_MOVE
//两指按下结束
Cesium.ScreenSpaceEventType.PINCH_END
//两指移动
Cesium.ScreenSpaceEventType.PINCH_MOVE
//两指开始触碰
Cesium.ScreenSpaceEventType.PINCH_START
//滚轮事件
Cesium.ScreenSpaceEventType.WHEEL
​