第四天：一些控件功能

自定义事件显示查看帧率

//显示帧率
viewer.scene.debugShowFramesPerSecond = false;
document.addEventListener('keydown', function (event) {
    var e = event || window.event || arguments.callee.caller.arguments[0];
    if (e) {
        switch (e.keyCode) {
            case 70: //F键查看帧率
                viewer.scene.debugShowFramesPerSecond = !viewer.scene.debugShowFramesPerSecond;
                break;
            default:
        }
    }
});

屏蔽默认双击追踪事件,在添加图片点位时点击会出现视角锁定bug

viewer.cesiumWidget.screenSpaceEventHandler.removeInputAction(Cesium.ScreenSpaceEventType
.LEFT_DOUBLE_CLICK);

设置操作习惯

//设置操作习惯(禁止中间滑轮旋转视角)  允许用户放大/缩小的输入。   //鼠标滑轮与两指缩放
viewer.scene.screenSpaceCameraController.zoomEventTypes = [Cesium.CameraEventType.WHEEL, Cesium
    .CameraEventType.PINCH
];
//允许用户以3D和Columbus视图倾斜（旋转）或以2D扭曲的输入。  //按下鼠标右键与两指拖拽
viewer.scene.screenSpaceCameraController.tiltEventTypes = [Cesium.CameraEventType.PINCH, Cesium
    .CameraEventType.LEFT_DRAG
];
// 将原来鼠标左键拖动平移视图修改为鼠标右键拖动
viewer.scene.screenSpaceCameraController.rotateEventTypes = [Cesium.CameraEventType.RIGHT_DRAG];

//相机平移旋转惯性为0
viewer.scene.screenSpaceCameraController.inertiaTranslate = 0;
viewer.scene.screenSpaceCameraController.inertiaSpin = 0;

打印点击位置的坐标

// // 用来打印坐标位置，方便调试
this.handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas); //鼠标事件

// //输出位置，便于调试
this.handler.setInputAction(function (event) {
    // 得到当前三维场景的椭球体
    let ellipsoid = viewer.scene.globe.ellipsoid
    console.log(event.position + '屏幕坐标');   

    // let cartesian3 = viewer.scene.pickPosition(event.position) //场景坐标
    // console.log(cartesian3);

    // 判断是否支持从深度缓冲区中拾取
    console.log(viewer.scene.pickPositionSupported);

    // 世界坐标
    let cartesian3 = viewer.scene.camera.pickEllipsoid(event.position, viewer.scene.globe.ellipsoid)
    console.log(cartesian3);

    console.log('世界坐标: ' + cartesian3.x + ',' + cartesian3.y + ',' + cartesian3.z)
    let cartographic = ellipsoid.cartesianToCartographic(cartesian3);
    console.log('弧度: ' + cartographic.longitude + ',' + cartographic.latitude + ',' + cartographic
        .height)
    let lat = Cesium.Math.toDegrees(cartographic.latitude)
    let lng = Cesium.Math.toDegrees(cartographic.longitude)
    let alt = cartographic.height
    console.log('经纬度: ' + lng + ',' + lat + ',' + alt)

    let heading = Cesium.Math.toDegrees(viewer.camera.heading).toFixed(2);
    let pitch = Cesium.Math.toDegrees(viewer.camera.pitch).toFixed(2);
    let roll = Cesium.Math.toDegrees(viewer.camera.roll).toFixed(2);
    console.log(heading + ',' + pitch + ',' + roll);
}, Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK)

打印当前视角的相机信息

// 用来打印相机位置，方便调试
document.addEventListener('keydown', function (e) {
    switch (e.key) {
        case '1':
            console.log(viewer.scene.camera.position)
            console.log(viewer.scene.camera.heading)
            console.log(viewer.scene.camera.pitch)
            console.log(viewer.scene.camera.roll)
            break;
        default:
            break;
    }
})

== 此文章为项目中用到的设置，记录一下 ==