Cesium的相机控制

代码如下：

<script>
    var viewer = new Cesium.Viewer("cesiumContainer");

    /*
    * 创建自己的事件处理程序，使相机朝向鼠标的方向，并在按下相应的键时向前后，左右，上下移动。
    * */
    var scene = viewer.scene;
    var canvas = viewer.canvas;

    canvas.setAttribute('tabindex','0');
    canvas.onclick = function () {
        canvas.focus();
    }
    var ellipsoid = viewer.scene.globe.ellipsoid;
    scene.screenSpaceCameraController.enableRotate = false;
    scene.screenSpaceCameraController.enableTranslate = false;
    scene.screenSpaceCameraController.enableZoom = false;
    scene.screenSpaceCameraController.enableTilt = false;
    scene.screenSpaceCameraController.enableLook = false;

    //创建变量来记录当前的鼠标位置，以及用于跟踪相机如何移动的标志
    var startMousePosition;
    var mousePosition;
    var flags = {
        looking : false,
        moveForward : false,
        moveBackward : false,
        moveUp : false,
        moveDown : false,
        moveLeft : false,
        moveRight : false
    };

    //处理用户输入事件。可以添加自定义函数，以便在用户输入时执行
    var handler = new Cesium.ScreenSpaceEventHandler(canvas);
    handler.setInputAction(function (movement) {
        flags.looking = true;
        mousePosition = startMousePosition = Cesium.Cartesian3.clone(movement.position);
    },Cesium.ScreenSpaceEventType.LEFT_DOWN);
    
    handler.setInputAction(function (movement) {
        mousePosition = movement.endPosition;
    },Cesium.ScreenSpaceEventType.MOUSE_MOVE);

    handler.setInputAction(function (position) {
        flags.looking = false;
    },Cesium.ScreenSpaceEventType.LEFT_UP);

    function getFlagForKeyCode(keyCode) {
        switch (keyCode){
            case 'W'.charCodeAt(0):
                return 'moveForward';
            case 'S'.charCodeAt(0):
                return 'moveBackward';
            case 'Q'.charCodeAt(0):
                return 'moveUp';
            case "E".charCodeAt(0):
                return 'moveDown';
            case "D".charCodeAt(0):
                return 'moveRight';
            case 'A'.charCodeAt(0):
                return 'moveLeft';
            default:
                return undefined;
        }
    }

    document.addEventListener('keydown',function (e) {
        var flagName = getFlagForKeyCode(e.keyCode);
        if (typeof flagName !== 'undefined'){
            flags[flagName] = true;
        }
    },false);

    document.addEventListener('keyup',function (e) {
        var flagName = getFlagForKeyCode(e.keyCode);
        if (typeof flagName !== 'undefined'){
            flags[flagName] = false;
        }
    },false);

    //事件发生时更新相机
    //点击获取坐标，
    viewer.clock.onTick.addEventListener(function (clock) {
        var camera = viewer.camera;
        if (flags.looking){
            var width = canvas.clientWidth;
            var height = canvas.clientHeight;

            var x = (mousePosition.x  - startMousePosition.x) / width;
            var y = -(mousePosition.y - startMousePosition.y) / height;
            var lookFactor = 0.05;
            //如果相机没有在2D模式下，则以弧度沿其上向量的相反方向围绕其右向量旋转
            camera.lookRight(x * lookFactor);//参数是弧度，这是转换成弧度
            //如果相机没有在2D模式下，则沿其右向量的相反方向围绕其up轴旋转
            camera.lookUp(y * lookFactor);

            //鼠标离中心的距离决定了转弯的速度。靠近中心位置会使相机速度变慢，而离中心越远则相机移动越快
            var cameraHeight = ellipsoid.cartesianToCartographic(camera.position).height;
            var moveRate = cameraHeight/100.0;

            if (flags.moveForward){
                camera.moveForward(moveRate);
            }
            if (flags.moveBackward){
                camera.moveBackward(moveRate);
            }
            if (flags.moveUp){
                camera.moveUp(moveRate);
            }
            if (flags.moveDown){
                camera.moveDown(moveRate);
            }
            if (flags.moveLeft){
                camera.moveLeft(moveRate);
            }
            if (flags.moveRight){
                camera.moveRight(moveRate);
            }
        }
    })
</script>

如下：

direction 是视线方向，up 是相机的快门键方向，right 是前两个向量 叉乘得到的第三个向量方向，这样组成了三维