Animation system in three.js

Questions
1

Hello there,

I have tried to chain two animations together by creating subclips of them.

In order to achieve this I have the following steps for my initial attempt:

  const model = data.scene.children[0];
  const dance = data.animations[0];
  
  // cut the animation
  const half1 = AnimationUtils.subclip(dance, 'half1', 0, 200);

  const mixer = new AnimationMixer(model);
  // first action whose end will be interpolated with the start of 
  // action2
  const action1 = mixer.clipAction(half1);

  //action2 with Loop Mode THREE.LoopRepeat, so we will get 
 // a final looping animation
  const action2 = mixer.clipAction(half1);

  
  action1.setLoop(THREE.LoopOnce);
  action1.play();


  action2.crossFadeFrom(action1, 1.5).play();
  
  model.tick = (delta) => mixer.update(delta);

  return model;

But crossFade doesn’t seem to be doing anything at all, maybe I need to somehow reset the animation first?

2

I think you can check if the animation clips are embedded correctly in ActionEditor of Blender.