WHEEL Handler: Get before and after height?

CesiumJS
1

Hi all,

This is probably a simple question, but how can I get the before and after height of a WHEEL ScreenSpaceEventHandler?

Here's what I have:

    // Wheel Handler: Functionality for zoom in/out (mouse wheel)
    WheelHandler = new Cesium.ScreenSpaceEventHandler(scene.canvas);
    WheelHandler.setInputAction(
        function (event) {
            var mousePosition = scene.camera.position;
            var height = ellipsoid.cartesianToCartographic(mousePosition).height;

            console.log("Zoom: " + event + " | Height: " + height);
        }, Cesium.CameraEventType.WHEEL);

The console generally logs this on zoom in/out:

Zoom: 120 | Height: 1383.0302729777552
Zoom: 120 | Height: 924.5651569244244
Zoom: 120 | Height: 620.3080954100334
Zoom: -120 | Height: 418.39081047853193
Zoom: -120 | Height: 552.3926363814553
Zoom: -120 | Height: 731.466938753359

The height is always the starting height, and I'm not sure what the zoom is representing (some factor of how far to zoom I'm guessing?) Since the 'event' parameter is only giving me an integer, are there any other options? Thanks in advance.

2

The +/- 120 that you are seeing is the amount in degrees the wheel was turned. The amount to zoom is based mostly on that number and the current height of the camera.

You could add a custom render loop. For example, if you are using the Viewer:

viewer.useDefaultRenderLoop = false;

var scene = viewer.scene;

var camera = scene.camera;

function render() {

viewer.resize();

var currentHeight = ellipsoid.cartesianToCartographic(camera.position).height;

scene.initializeFrame();

var currentTime = viewer.clock.tick();

var newHeight = ellipsoid.cartesianToCartographic(camera.position).height;

if (newHeight !== currentHeight) {

// camera zoomed

}

scene.render(currentTime);

Cesium.requestAnimationFrame(render);

}

Cesium.requestAnimationFrame(render);

Regards,

Dan