Home > Enterprise >  Three.js FBX model animation stuck on first frame
Three.js FBX model animation stuck on first frame

Time:10-26

I have an FBX model of a character. I also downloaded a simple walking animation from Mixamo, without skin. Here is how I am loading the character and animation:

const loader = new THREE.FBXLoader();
let mixer;
loader.load( 'Assets/T-Pose.fbx', function ( object ) {

    let anim = new THREE.FBXLoader();
    anim.load('Assets/Walking.fbx', function(anim){
        mixer = new THREE.AnimationMixer(object);
        let walking = mixer.clipAction(anim.animations[0]);
        walking.play();
    })

    scene.add( object );

} );

In my render loop, I just update the mixer.

function render(){
    ...
    if (mixer) mixer.update();
}

When I load up my scene, though this is what I see:

Unexpected

The character is stuck on this frame and is not continuing the rest of the animation. What did I do wrong here?

CodePudding user response:

When calling mixer.update(), you need to give it the time passed in seconds:

const clock = new THREE.Clock();

function render(){
  ...
  let mixerUpdateDelta = clock.getDelta();
  if (mixer) mixer.update(mixerUpdateDelta);
}

You can see the three.js documentation about animation: https://threejs.org/docs/?q=animation#manual/en/introduction/Animation-system

  • Related