camera rotate with arrow keys

1. A concise explanation of the problem you're experiencing.

Hello,

The following codes work almost without any problem. But there is something missing which I cannot solve.

I want to change the camera angle by pushing the arrow keys. The codes do this BUT instead of directing the camera towards right-left-up-down, they only direct it towards the north.

What I want to do is whenever I turn my camera towards a point, apart from the north, I want the camera to turn to the direction I pointed out.

2. A minimal code example. If you've found a bug, this helps us reproduce and repair it.

  document.addEventListener('keydown', function (e) {
        setKey(e);
    }, false);

    function setKey(event) {
        var horizontalDegrees = 5.0;
        var verticalDegrees = 5.0;
        var scratchRectangle = new Cesium.Rectangle();
        Cesium.Camera.DEFAULT_VIEW_FACTOR = 0;

        var viewRect = camera.computeViewRectangle(viewer.scene.globe.ellipsoid, scratchRectangle);
        if (Cesium.defined(viewRect)) {
            horizontalDegrees *= Cesium.Math.toDegrees(viewRect.east - viewRect.west) / 360.0;
            verticalDegrees *= Cesium.Math.toDegrees(viewRect.north - viewRect.south) / 180.0;
        }

        if (event.keyCode === 39) { // right arrow
            camera.rotateRight(Cesium.Math.toRadians(horizontalDegrees));
        } else if (event.keyCode === 37) { // left arrow
            camera.rotateLeft(Cesium.Math.toRadians(horizontalDegrees));
        } else if (event.keyCode === 40) { // up arrow
            camera.rotateUp(Cesium.Math.toRadians(verticalDegrees));
        } else if (event.keyCode === 38) { // down arrow
            camera.rotateDown(Cesium.Math.toRadians(verticalDegrees));
        }
    }

Notice the description for the rotate functions in the doc (https://cesiumjs.org/Cesium/Build/Documentation/Camera.html#rotateRight) says:

Rotates the camera around the center of the camera’s reference frame by angle to the right.

I believe the default camera reference frame is east-north-up frame, so that’s up rotating up goes towards north. If you want to change the reference frame, check out this Sandcastle example (https://cesiumjs.org/Cesium/Build/Apps/Sandcastle/?src=Camera.html) and click “Set camera reference frame”.

Let me know if that helps. Otherwise, if you can put together a working Sandcastle example of your code it’ll make it easier for me to help you out. Just put together an example in Sandcastle and click “Share” and paste the link here.