Control gltf animation with slider

hi guys how can i control multiple gltf files with each one animation inside, with each a slider, so that the slider updates the position
animatables[0].masterFrame <— not working

(this sample gltf has many animations inside, my files has only one animation each file)

Hello and welcome to the Babylon community!

That’s expected, since masterFrame is only to access the property, not update it: Animatable | Babylon.js Documentation (

You can use goToFrame on the AnimationGroup to move all of its animations to a specific frame: Animatable | Babylon.js Documentation (

1 Like

Hello! thanks, yes, goToFrame already works in my example. What I need is the current frame to update the slider when the animation is playing. animatables sometimes works, but always is empty… on some gltfs

Oh I see, I misunderstood your question, sorry! Animatables can be empty because no animations are running on that group. So you need to check if they exist first. And to get the currently running frame, you can call getAnimations on the Animatable to get a RuntimeAnimation that has a currentFrame property: RuntimeAnimation | Babylon.js Documentation (

animation slider time control | Babylon.js Playground (


thank you very much for your help, is there a way to read out the current frame if animatables is empty? I have two animations, one animatable is empty, although both files contains an animation, screenshot enclosed

Is this second animation playing?

Yes, both animations can be played, and controlled with a slider, just reading the current frame in the second animation is not possible due to the empty animatables. the debugger also shows the current frame in both animations

Can you provide us with a playground repro of this object?

ok i was gone for a long time. I suspect it’s the file, unfortunately I can’t share the original, I recreated it using two other gltf files and seems to work perfectly, I’ll investigate the problem further. now i have another problem too, two materials with alpha. one sometimes disappears depending on the angle

You should have a look in here to fully grasp what is happening Transparent Rendering | Babylon.js Documentation and transparent mesh sorting which provides all the possible tricks depending on your scenario

ok thanks for the info, transparencyMode to alphatest does the job for me.

1 Like

ops, My fault, I have 2 different questions in one post, now I can’t give two answers as a solution
#carolhmj has the first solution…

no problem lol