GLTF Split animations and CrossFade them

Questions
, ,
1

Hi,

I have a model .GLTF with 3 animations in an array.

I make this to split the animations with successful

So, when I call the crossFadeTo not work.

2

Please have a look at this example: https://threejs.org/examples/#webgl_animation_skinning_blending

It uses crossfading in order to transition into a new animation.

3

I made this.

SetWeight and play action, but the animation subclip is wrong… my model animates and freezes, after 2 seconds, he continues playing.

When I play full animation works fine, however, when I split the animations (subclip), it break.

var idleClip = THREE.AnimationUtils.subclip(animations[0],'idle', 30,40)
var idleAction = mixer.clipAction(idleClip);
idleAction.play() //don't work fine.
4

@Denis_Ken please provide enough information for us to fully reproduce the problem — code, your model, and ideally a demo. And please explain what you mean when saying it doesn’t work — does it look incorrect? does nothing happen at all? are there errors in the JS console?

5

Demo is attached. (Scripts, mongoose localhost and model)

Sorry, for the texture, but I can’t share.

Pay attention in animation, he plays, stop and play again, but I set “subclip” 30 to 40.
image

It works fine If I play mixerAnimations without subclip. But sequential
image

The model has blend shape and normal animation.

Demo.zip (1.0 MB)

1 Like
6

Without the original .blend file I am guessing a bit, but to confirm — you want keyframes 30–39 to be split into a separate clip and played? The glTF file contains many keyframes, some tracks more than others:

55%20AM

I’m guessing that’s not your intention… Note that the Blender exporter may “bake” your animation at 24-30fps under certain circumstances. If that happens, you won’t be able to split the animation cleanly like you want to do. Some options:

  1. Try using linear interpolation for all keyframes, which may prevent the Blender exporter from baking keyframes.
  2. Try using the (WIP) version of the Blender exporter here, which can export multiple animations as separate clips.
7

The 3D artist have just one timeline with bone animation and shape key animations of the character. And want to export it as one, like the flow with Unity. one animation sequence of bone and shape animations, and in code split the frames in sub loops to cross fade between them.

(blend file)
bot.blend (1.5 MB)

8

I see. The issue you’re running into is discussed here — the exporter is not providing data that can be split into frames.

Until that is fixed, you can try the two suggestions above, or perhaps export to another format. I tried COLLADA and FBX quickly — COLLADA didn’t load, but FBX and FBXLoader might work. The keyframes looked much closer to your original timing.

Perhaps there are changes to .subclip() that would support this better (slice by time, rather than number of frames, and automatically appending starting frames where needed?) but at the moment I don’t have time to investigate that.