Proper way to disconnect and reconnect an animation group in scene

Hi there:

I wonder if is there a way to disconnect an animation group and, later, reconnect it.

Looking for info along the API docs, I can’t identify a clear approach to have this done.

Any help with this?

1 Like

What do you mean by “disconnect”? Maybe you can remove it from the array of animation groups and re-add it later on?

Hi there @Evgeni_Popov:

The case is that, as you can see in this other thread of the forum, the BABYLON.GLTF2Export.GLBAsync API has a fault, consisting in that all the animations in scene are exported, even when some nodes are not (by means of the shouldExportNode option of the API). That is, you end exporting a GLB with animations pointing to non-existent nodes.

So, when I export my scene to GLB, avoiding in such process some nodes, and I try to load it later within Google’s model-viewer, an exception is raised, as the model-viewer importer seems to be very picky with the Kronos Group’s GLTF specification, and doesn’t like at all animations relative to nodes that are not in the file.

As a super-dirty workaround, I’m exporting all the nodes, scaling to 0 those that must not be shown in AR (by means of Google’s model-viewer web component).

A way better workaround would be:

  1. to disconnect from the scene the animation groups relatives to nodes that are not going to be exported (the animations must be not found by the exporter);
  2. export then the GLB with only the enabled nodes of the scene and the animations not disconected (the ones relative to the enabled nodes);
  3. reconnect the animation groups in order to let the user follow working in the BJS part of the webapp, as if nothing had happened.

Is in order to accomplish this last approach, what I’m asking about disconnect/reconnect animation groups.

Thanks for your time.

scene.removeAnimationGroup and scene.addAnimationGroup should do the trick

1 Like

Hi, @sebavan:

What I can’t understand here is how is it going to be possible to call, let’s say: scene.addAnimationGroup(scene.getAnimationGroupByName("foo"))

if the foo animation group is not already in the scene, after calling scene.removeAnimationGroup(scene.getAnimationGroupByName("foo"))

I mean that it would be necessary a data structure (array) out the scene, in order to store there the removed animation groups, to be available for adding them later, isn’t it?

Thanks for your time.

Actually, addAnimationGroup and removeAnimationGroup only add/remove the entry from the scene.animationsGroup array.

So, you can store somewhere scene.getAnimationGroupByName("foo") before removing it from the scene, then later on call scene.addAnimationGroup by passing the stored pointer.


Hi again, @sebavan and @Evgeni_Popov:

Sadly, I’ve found out that, when you have a certain level of complexity in your scene, for example, with instances, skeletons, and so on, removeAnimationGroup doesn’t seem to work properly.

Please, take a look at this PG, where I’m trying to delete all the animation groups with this lines at the end of the code:

scene.animationGroups.forEach(element => {

…but the Inspector shows a few left in scene:

What would be the way to delete (disconnect, indeed, as I would add them again later) all the animations in such a case?

Thanks for your time.

removeAnimationGroup is modifying the scene.animationGroups array that you are currently looping over by doing scene.animationGroups.forEach, so bad things can happen :slight_smile:

If you want to remove all animation groups, simply do scene.animationGroups = [].

1 Like

Similar question.
I see above that the way to delete the animation group on removal from scene is something like:

But what if you’ve loaded a number of glbs that all have similar (or the same) animation groups. How do you identify which is which? Is there a method to load them to give them all a container name so that they can be removed all at once by removeAnimationGroup? (i suppose i could track which array elements are associated with which glb, but that seems messy)

Here, you can see a bunch of similar/same animation groups. What if you want to remove just number 38 for example. Or better, all of the animation groups that loaded in with a particular glb.

Ah, i think my answer is here with asset containers: Babylon.js Playground

But seems weird that i would need to create a duplicate in order to be able to remove it later (in the case that i don’t need duplicates).

Ok, this works:

Dunno if it’s the right way to do it, but works well. Just have that issue of the original loaded mesh still being around… just need to figure out how to remove that as well. So im left with only one GLB+AnimationGroups that are easily removable.

Ok, here’s a version that deletes the original as well:

Oh dumb. I dont need the duplicate at all… The trick was renaming all of the groups:

          this.animGroups[id][] = ag;
 = id + '-' +;