Animation countdown timer

I’m hoping to show a countdown timer that displays how long left until a mesh reaches a particular point in my scene. I have setup movement as an Animation within an AnimationGroup, but can’t find anyway of extracting the latest frame, or time remaining of the animation in order to display back to the user.


Any help appreciated.


You can still take the animation you want and check for the latest key right? You have access to all the individual animations and thus you can call animation.getKeys()

Unless I misunderstood your ask :wink:

My animation is programmatically created in Babylon, and just involves a mesh moving from A to B. The getKeys function would just return my A and B would it not? Rather than the interpolated values in-between?

But you want the frame or the current value? (you can use animation.evaluate(frame) to get the interpolated value)

My end goal is to work out how long left of the animation (in seconds) there is. I believe the way I would need to do this would be something like:

// pseudocode
let framesRemaining = animation.duration - animation.currentFrame
let timeRemaining = framesRemaining / engine.getFps()

It’s the currentFrame, or at least framesRemaining piece that i am struggling to work out.

With Animation.evaluate, how do I know what the current frame is?

Look here what I did for the sandbox:
Babylon.js/animationBar.tsx at master · BabylonJS/Babylon.js (

Here is the counter which you’ve asked for -
You’ll need to stop animation at its end, otherwise it will count again and again.

1 Like