GoogleEarth API Migration, 'viewchangeend' event listener equivalent?

CesiumJS
1

Is there a way to set up an event listener for the camera movements?

comming from the earth API there are View events that can have listeners set up on.

google.earth.addEventListener(ge.getView(), ‘viewchangeend’, callBackFunction);

As a workaround I have a setInterval running in the background inspecting the heading value, as I am primarily interested in when the heading has changed.

setInterval(function () {

var h = Math.round(180 * scene.camera.heading / Math.PI) ;

if (Math.abs(currentHeading - h) > 3) {

    currentHeading = h;

    functionToCallWhenHeadingChanges({ heading: currentHeading });

}

}, 500);

Is there a better way of doing this?

It comes in handy for clustering or changing content based on perspective.

2

Hi Berwyn,

Cesium does not have view events yet, but I agree it is a good idea so I submitted #2366. Keep an eye on it.

In the meantime, instead of using setInterval, listen to the preRender event.

function foo(scene, time) {

}

scene.preRender.addEventListener(foo);

For an example, see the ICRF part of the Camera example in Sandcastle.

Patrick

3

Hey there,

I'm not sure if this is what you're looking for, but this is how i handled it. (This doesn't work if you're tracking). I'm new to Cesium, but the only way so far that I find that a user can move a camera is through the mouse. Left click, right click, and the middle wheel. The middle wheel can already be listened through cesium built in events, but holding down left or right click and moving your mouse isn't. Feel free to look at the following.

        var mouseLeftDown = false;
        var mouseRightDown = false;
        var mouseHandler = new Cesium.ScreenSpaceEventHandler(scene.canvas);

        mouseHandler.setInputAction( // Wheel
            function (movement) {
                // ACtion of zooming in and out through wheel here
            },
            Cesium.ScreenSpaceEventType.WHEEL
            );

        mouseHandler.setInputAction( // Left down
                function(movement){
                        mouseLeftDown = true;
                },
                Cesium.ScreenSpaceEventType.LEFT_DOWN
        );
        mouseHandler.setInputAction( // Left up
                function(movement){
                        mouseLeftDown = false;
                },
                Cesium.ScreenSpaceEventType.LEFT_UP
        );
        mouseHandler.setInputAction( // Right down
                function(movement){
                        mouseRightDown = true;
                },
                Cesium.ScreenSpaceEventType.RIGHT_DOWN
        );
        mouseHandler.setInputAction( // Right up
                function(movement){
                        mouseRightDown = false;
                },
                Cesium.ScreenSpaceEventType.RIGHT_UP
        );
        document.getElementById('cesiumContainer').addEventListener('mousemove', function(e) { // Mouse moving
            if (mouseLeftDown || mouseRightDown){
                        // Events of moving mouse while holding down left or right click here.
                }
        }, false);