Best way to do stepped (non interpolated) animation?

Currently I’m using setInterval to make object changes at fixed intervals e.g. like say toggling a light on and off, but I was wondering if the Animation classes can somehow be used to do the same thing, just without any interpolation between key frames?

Using setInterval I strangely ended up with some timing glitches, like other processes were interferring and causing the intervals not to be consistent. I see in the Sprite code that a delta time check is being used in a render method, not setInterval. Is this the best approach or can the Animation classes be used without interpolation?

This may prove useful for you to look at https://doc.babylonjs.com/how_to/sequence

In particular the sweep_keys for the door. Frames 0 to 3*frame rate all have value 0 hence no interpolation. Careful use of constant values over set key frames can give you non interpolated intervals

1 Like

Thanks @JohnK

Since I came across this post when trying to do something similar I’m adding my playground here in case anyone finds it interesting.

In this playground I’m syncing animation with a video using requestVideoFrameCallback.

One issue remains where the initial canvas gets distorted for some reason when engine._renderViews() is called. I do not quite get what’s happening yet.

Anyway, the stepped animation part works.

1 Like