Cloned Submeshes Do Not Animate?

Hello everyone!

In the PG below, the submesh clones (“boxB”) are spawning correctly with the parent mesh clones (“boxA”).

However, I’m not sure why the submesh animation ("boxBMove) is not applied to the clones as well :thinking:

Thanks in advance for the help!

In boxBMove no variables change value since step *= 1 does not change step. Do you mean step += 1 ?

Hello John, and thanks for the reply!

I recycled that from an earlier project, so it’s not moving the way it should, but you’ll notice that the original boxB is rotating, but the boxB clones are not (you might have to zoom in to see it).

I’m just not sure how to tell all of the boxB’s to also rotate. I thought the clone function would take care of that.

Here’s an option to get the desired results:

However, this method is quite inefficient, but I don’t yet know of a way for meshes to share animations (such that the triggering of the animation, e.g. using scene.beginAnimation(...) will cause all sharing meshes to animate).

This also seems to be a good use case for Use Instances - Babylon.js Documentation

Also, please note that the Playground provided is not technically using Babylon animations (i.e. BABYLON.Animation). Please check out this guide: Animations - Babylon.js Documentation

Hello @gbz!

Thanks for the information! For what I’m trying to create, it seems that instances won’t work. Each main mesh will have submeshes each with their own randomly-generated properties (textures, animations, scaling, etc.). Those submeshes will then affect the way the main mesh (the parent) will move through the scene. I’m basically trying to create procedural generation for a digital character (kind of like the Spore game) It seems that instances won’t allow for that, but I could be wrong.

Is it better to use BabylonJS animations vs. what I created (I suppose that’s just JavaScript?).

I’ve only been programming and working with BabylonJS for two weeks, so any advice or assistance is greatly appreciated!

Hey @Anderson34, good point that Instances may not support different poses or out-of-sync animations.

I’m not so experienced with BABYLON.Animation, though I’d really recommend you try it out. It comes with powerful features as mentioned in Animations - Babylon.js Documentation, such as animation blending, awaiting animations using async/await, and something not mentioned is executing a callback function once an animation is complete or loops. For this, check out the Typescript docs for BABYLON.Scene.beginAnimation:

(method) BABYLON.Scene.beginAnimation(target: any, from: number, to: number, loop?: boolean | undefined, speedRatio?: number | undefined, onAnimationEnd?: (() => void) | undefined, animatable?: BABYLON.Animatable | undefined, stopCurrent?: boolean | undefined, targetMask?: ((target: any) => boolean) | undefined, onAnimationLoop?: (() => void) | undefined): BABYLON.Animatable

target allows you to target a mesh or skeleton with animations.

from and to allow you to choose how much of your animation to run.

onAnimationEnd? and onAnimationLoop? allows you to execute a callback function either on the end of an animation or every animation loop, respectively.

speedRatio lets you make your animation run faster or slower.

Excellent, I will check out the options available with BABYLON.Animation. I think you’re right to consider efficiency since I will have hundreds of characters in scene at once.

Thanks again for the help! :smiley: :+1:

1 Like

When created clones are independent so animating the original will not animate the clone, you need to add each one to the animation


Thanks again @JohnK for the information and the help. I definitely understand the process better now :smiley: :+1:

Hello again everyone!

It seems that as soon as one problem is solved a new one arises! :thinking:

I could start a new thread, but this issue is connected to what we’ve been discussing here.

I was working with the code that @gbz provided to animate the child meshes of cloned parent meshes (HERE), and this definitely works, but it seems to apply to ALL of the child submeshes. Using this code, I’m not sure how to animate multiple cloned child submesh types separately. For instance, submesh type 1, submesh type 2, submesh type 3 are all children of the parent mesh, but each has a different function for their animation.

The code above from @gbz calls the parent array (characterBoxA), so my solution was to try and create an array for each of the submesh clones, but I ran into an issue. When BabylonJS clones a parent (“characterboxAclone0”), the child clone (“BoxB”) has this name format: characterboxAclone0.boxB. When I tried to create an array with this format, I get “characterboxAclone0 is not defined.”

In summary, here are the questions:

  1. Will creating a unique array for each submesh work (like it did for ALL submeshes in the example above)?

  2. If the automatically-generated names assigned by the clone function aren’t in a valid format, how can an array be created for them?

Update: I figured it out :smiley: :+1:

It case it helps someone else, I duplicated the same function (boxBMove) for a new mesh (boxC), but changed the submesh from [0] to [1].