animationthree.jsmixamo

Adding different animations to existing mixamo FBX models three.js


I have copied code for loading an animation (dancing twerk from mixamo) onto an existing fbx model (Douglas from mixamo) from the tutorial here https://www.youtube.com/watch?v=8n_v1aJmLmc but it does not work, as SimonDev uses version 118 of three.js whilst I am using version 128.

const loader = new FBXLoader();
//load model
loader.setPath('../models/characters/');
loader.load('Douglas.fbx', (fbx) => {
    //scale the model down
    fbx.scale.setScalar(0.0115);
/*
  fbx.traverse(c => {
    c.castShadow = true;
  });
  
*/
  //animate character
  const anim = new FBXLoader();
  anim.setPath('../models/characters/animations/');
  anim.load('Twerk.fbx', (anim) => {

    this.walkMixer = new THREE.AnimationMixer(anim);

    //creates animation action
    const walk = this.walkMixer.clipAction(anim.animations[0]);
    walk.play();
  });

 this.object.add(fbx);
});

This is in my update function

//animation
        if (this.walkMixer) {
            this.walkMixer.update(this.clock.getDelta());
        }

The animation worked previously when it was the same model with the animation, and with gltf, but I am trying to separate the model and animation, so that I can apply different animations from mixamo. My code does not load the animation at all and he simply stands in a T-pose. I do not know what the current code for loading a separate animation from mixamo onto a current fbx model is. I would like to know how, as I would like to load and play multiple animations onto the same model.


Solution

  • I managed to sort it out-> it was due to me having multiple imports of three.js