Additive animations behave very oddly

I have been experimenting with animations in BabylonJS, but I have not been able to get additive animations working properly.

I have followed the Advanced Animation tutorial, and I also looked at the additive animation example.

For testing purposes, I created a simple mesh with a simple rig. Here is a demo:

I created two simple animations: the first animation is an infinite walking loop, and the second animation scales the head up/down.

I want to combine these two animations together, and be able to control them independently (so the walking animation can be played/paused at any time, and the head size can be scaled up/down at any time).

But immediately I run into problems:

  1. While the walking animation is playing, the head animation is completely ignored (which means the slider does not work).

  2. When the walking animation is paused, the head slider now works, except it completely ignores the walking animation.

  3. When using AnimationGroup.MakeAnimationAdditive the model completely disappears when pausing the animation and moving the slider.

  4. When using AnimationGroup.MakeAnimationAdditive it will clamp all scales to minimum 1, so you cannot have bone scales lower than 1.

  5. If you play the Head Size animation then blending works, but I do not want the animation to play, I want to keep the head size animation paused (so it can be selected with the slider).

    And it still doesn’t blend properly when the walking animation is paused. It seems like Babylon is just completely ignoring paused animations, which is incorrect: it should only be ignoring stopped animations.

    Also, the scale is completely wrong, the head is far too big. This is probably related to problem 4.

  6. If you call setWeightForAllAnimatables before calling play then it behaves differently than calling setWeightForAllAnimatables after play.

I have tried every combination I could think of. Using syncAllAnimationsWith does not help. Using play(true) + speedRatio = 0 does not work. Using setWeightForAllAnimatables(0) does not work.

Also, I have tested the GLB file in a glTF viewer and the animations work correctly (but without blending), so I know it’s not an issue with the animations.

Additive animations were made by c-morten (

You can maybe try to ping her/him on Github?

1 Like

It seems for additive animations to work you need that there’s at least a non additive animation running and the additive animations themselves must run too (pause does not work as you noticed).

So, when you want to pause the walking animation, you should run a single frame instead. And for the additive animation, you should also run the single frame you are interested in, instead of pausing the anim and using goToFrame:

Note: the first animation of a glb file is automatically played at load time. Here it is the head animation, so we must first stop it so that headSize.start(true, 1, * size, * size); does work (calling start when the animation is already started has no effect). Note also that for some reason setWeightForAllAnimatables(1); must be called again each time we stop/start an animation.

1 Like

Might be worth adding to the doc @PirateJC ?


@Evgeni_Popov Thank you so much! I’ll play around with that workaround and see if it works for my use case.

1 Like

Also, I figured out the issue with the scaling. When calling MakeAnimationAdditive you have to pass a reference frame.

It defaults to 0, but because the animation goes from small to big the reference frame needs to be 0.5, so I fixed it by doing this:

headSize = BABYLON.AnimationGroup.MakeAnimationAdditive(headSize, * 0.5);