I'm rotating my Cesium globe through this code:
spinGlobe( dynamicRate ){
var previousTime = Date.now();
this.viewer.scene.postRender.addEventListener(function (scene, time){
var spinRate = dynamicRate;
var currentTime = Date.now();
var delta = ( currentTime - previousTime ) / 1000;
previousTime = currentTime;
this.viewer.scene.camera.rotate(Cesium.Cartesian3.UNIT_Z, -spinRate * delta);
});
}
Now I want to stop it, so how I can I stop this globe rotation on a particular event?
There's a removeEventListener that needs to be passed a reference to the same function that you provided to addEventListener.
Here's a Sandcastle Demo. Note that this demo does not protect against the user clicking "Spin" multiple times, so the user will need to hit "Stop" an equal number of times. Real (non-demo) code should take care not to add multiple event listeners for the same event.
var viewer = new Cesium.Viewer("cesiumContainer");
var previousTime = Date.now();
var spinRate = 1.0;
function applyGlobeSpin() {
var currentTime = Date.now();
var delta = ( currentTime - previousTime ) / 1000;
previousTime = currentTime;
viewer.scene.camera.rotate(Cesium.Cartesian3.UNIT_Z, -spinRate * delta);
}
function startSpinGlobe() {
previousTime = Date.now();
viewer.clock.onTick.addEventListener(applyGlobeSpin);
}
function stopSpinGlobe() {
viewer.clock.onTick.removeEventListener(applyGlobeSpin);
}
Sandcastle.addToolbarButton("Spin", startSpinGlobe);
Sandcastle.addToolbarButton("Stop", stopSpinGlobe);