How can i smoothly animate polygons?

When I try to animate a polygon by changing the height repeatedly, it works great for 10fps (100ms interval), but when I want to do it more frequently(f.e. 100fps, 10ms interval) it doesnt show any height change at all. Is this a bug or am i just doing it wrong?

var viewer = new Cesium.Viewer('cesiumContainer');

var polygon100 = viewer.entities.add({
    name : 'Green extruded polygon',
    polygon : {
        hierarchy : Cesium.Cartesian3.fromDegreesArray([-108.0, 42.0,
                                                        -100.0, 42.0,
                                                        -104.0, 40.0]),
        extrudedHeight: 500000.0,
        material : Cesium.Color.GREEN,
    }
});

var polygon10 = viewer.entities.add({
    name : 'Green extruded polygon',
    polygon : {
        hierarchy : Cesium.Cartesian3.fromDegreesArray([-118.0, 42.0,
                                                        -110.0, 42.0,
                                                        -114.0, 40.0]),
        extrudedHeight: 500000.0,
        material : Cesium.Color.RED,
    }
});

window.setInterval(() => {
    polygon10._polygon.extrudedHeight += 300;
}, 10);

window.setInterval(() => {
    polygon100._polygon.extrudedHeight += 3000;
}, 100);

viewer.zoomTo(viewer.entities);

Context: In my application i have an extruded polygon, where you can change the height with drag and drop. When i just change the height on mouse move event, its the same problem as when i update with 100fps.

I use Cesium 1.39 with chrome on mac os x.

Hi,

Use the Scene.preUpdate event (or Scene.preRender if you are using <1.42) instead of setInterval. It will run every time the simulation time is updated.

scene.preUpdate.addEventListener(function(scene, time) {
// update code goes here
});

``

Thanks,

Gabby

Hey Gabby,

thank you very much for your answer. However, your solution doesnt seem to work:

var viewer = new Cesium.Viewer('cesiumContainer');

var polygon10 = viewer.entities.add({
    name : 'Green extruded polygon',
    polygon : {
        hierarchy : Cesium.Cartesian3.fromDegreesArray([-118.0, 42.0,
                                                        -110.0, 42.0,
                                                        -114.0, 40.0]),
        extrudedHeight: 500000.0,
        material : Cesium.Color.RED,
    }
});

viewer.scene.preUpdate.addEventListener(function(scene, time){
    polygon10._polygon.extrudedHeight += 300;
}, 10);

viewer.zoomTo(viewer.entities);

The polygon still doesnt get animated. (Sandbox)

Here’s a working example using a CallbackProperty: https://cesiumjs.org/Cesium/Build/Apps/Sandcastle/?src=Hello%20World.html&label=Showcases&gist=cda0a1307fe0d5872f66027a9c2b2374

Thats a PogChamp, works great!

thanks you gabby <3