GLTF animations


I am evaluating using babylon.js as a render in a game. I’ve converted some relevant models to GLTF. Unfortunately when I load the model all animations are added as “animation groups” into the scene instead of being animations attached to the appropriate skeleton/mesh.

What is the right fix to this? In the GLTF I see the animations described as “animations” not animation groups.


I am successfully playing animations with babylon. Kind of the only pros for us to migrate from three.js.

All the animations I have tried are successfully played with Babylon, but it requires some work and is not out of the box.

The GLTF specification puts the animations on top level on the scene. I suppose that’s the reason why they are loaded as animation groups into the scene and not in the nodes.


This is correct.

@wd40bomber7: Why using animation groups is a problem?

@kmitov: Can you elaborate? I would love to make the process as smooth as possible

  1. When loading a gltf with many animations sometimes only one of them is played by default. So to make the all play you should go and play them with the play() method.
  2. It is quite difficult to make them repeat for a number of times. For example I need to repeat an animation 3 times and could not do it.
  3. If you want to finish at the last frame of the animation the goToFrame method is the answer which was unexpected at first.
  4. The animationGroup does have an animationLoop observer, but does not have an animationGroupLoop observer where you can count the loops of an animationGroup.

These are the first ones that could into my mind. These were decisions made by BABYLON on what API should be provided and if you’ve used this animations with other engines in requires some work to get them working based on the document.

So GLTF animations work, but require some coding the get them work.

1 Like
  1. Nope, you can also use animationStartMode: Use the glTF File Loader Plugin - Babylon.js Documentation
  2. Here you can use onAnimationLoop observable
  3. Not sure to understand this one
  4. We could add it, it is a good idea
1 Like
  1. Nice. Did not see the property
  2. Yes. I tried to do it like this and then realized it is an animationGroup and then realized 4.
  3. Based on some previous experience I was just expecting and looking for a different method. (“Curse of knowledge bias”) . But now that I know it, its great.
  4. Would be great for one of my use cases.
1 Like

Please open an issue on the repo for 4, I will take care of it asap

1 Like

@Deltakosh Maybe I’m misunderstanding how this is supposed to work.

I thought that a ‘scene’ would be the game world and all the models would be loaded into a scene. If this is true this means that animations need to be a property of their mesh/skeleton NOT a property of the scene. Otherwise if I want 5 spiders and try to play ‘walk’ all 5 spiders will start walking at the same time.

What is the right way to load models into a scene and animate them independently? (Or is the real answer to compose scenes somehow?)

You will get an animation group per spider so there is no problem to animate them individually

animation groups are actually pretty useful because they can let you gather more than one mesh inside an animation (like animating a character made of two meshes: upper and lower body) with one call

Using animationStartMode to play all of the animations at once should work, but this probably means the glTF is malformed. Each animation in glTF is supposed to represent something that you play individually (e.g. walk or run). You should not have to play all of the animations together for the model to animate correctly. See for a discussion about this.

That is not the case for us. The gltfs that are coming in, one of them had like 600 animations that all had to be played together. Animations were developed in Blender with constraints.

Yup, I understand. The loader flag is there primarily for this issue. glTF has strict requirements and is intended to work a specific way. I mentioned it so that you can consider asking the authors and/or asking the Blender exporter folks to update the assets to be correct instead of using a non-standard way of loading glTF.

1 Like

Edit: I figured it out. The problem was I thought that since SceneLoader.ImportMesh doesn’t show loaded animation groups neither did the asset manager. A fact that isn’t true. The asset manager does indeed tell you what animation groups it added which is really all I need. I’m still a little confused about why these animations count as “animation groups” but honestly its pretty irrelevant now that I can make this work.

Original message:
@Deltakosh Yes I understand animation groups have a purpose but I don’t want them for that purpose. I’m not sure I want animation groups at all.

What I want is to load a mesh and then control that meshes animations separately. Yes if I load the mesh four times I get four separate sets of animation groups added, but each set has exactly the same name as all the other sets. Since the load methods don’t include a “Loaded animation group” option I don’t see a way to tell them apart.

I don’t really understand why loading a mesh/skeleton constructs animation groups instead of animations, but there’s got to be a way for me to know which animations I just loaded.

In an ideal world Babylon.js would tie up all the loaded pieces into a single object that I could manipulate. (i.e. I loaded a spider so when I do things to that spider, erase it move it animate it those would all be things that apply to the spider model as a whole, not pieces of the spider, nor the scene).

Since that’s not an option I at least need the tools to ‘build’ that sort of object myself. Since the asset loader doesn’t tell me what animation groups it loaded I can’t properly make that association. Can anyone help? Thanks!

1 Like