Update animations of gltf model

Questions
1

Hello,
I have a model loaded with multiple animations

gltfLoader.load(
    '/models/Fido/DancingFido2.glb',
    (fido) =>
    {
        fido.scene.scale.set(0.4, 0.4, 0.4)
        fido.scene.position.set(1, -0.5, -0.9)
        scene.add(fido.scene)
        animations = fido.animations
                  
       // Animation
        mixer = new THREE.AnimationMixer(fido.scene)
        
        action = mixer.clipAction(fido.animations[activeAction])
        
         move1Action = fido.animations.find((clip) => clip.name === "Armature.001|shuffle-jumpandwave-f")
         move2Action = fido.animations.find((clip) => clip.name === "Armature.002|taunt-dumbbell-dance")
         move3Action = fido.animations.find((clip) => clip.name === "Armature.003|happy-time-m4-392441")
         move4Action = fido.animations.find((clip) => clip.name === "Armature.004|opening-move-01_68496")
         move5Action = fido.animations.find((clip) => clip.name === "Armature.005|groove-02_68517")
         move6Action = fido.animations.find((clip) => clip.name === "Armature.006|boomboom_dance")
         move7Action = fido.animations.find((clip) => clip.name === "Armature.007|boombayah_dance")
         move8Action = fido.animations.find((clip) => clip.name === "Armature.008|dance-graceful_250999")
         move9Action = fido.animations.find((clip) => clip.name === "Armature|groove-02_68495")
        
        actions = [ 
            move1Action ,
            move2Action ,
            move3Action ,
            move4Action ,
            move5Action ,
            move6Action ,
            move7Action 
        ]

        action.play()
    }
)

and a button with showoff() function which I’m trying to make the animation change at random every time it’s clicked

function showOff() {
let randomAction = actions[
(Math.floor(Math.random() * actions.length))
]
activeAction = randomAction
}

When clicked the variable activeAction changes but the animation doesn’t update

I do have this in my animation function

if(mixer)
{
mixer.update(deltaTime)
}

Not sure if I have the right approach but I can’t think of any other way
Thanks

2

Make sure you’re passing a valid delta to the update function. If it’s still not working - could you reproduce the issue on codepen?

Here’s an example of simple working animation (lines 35-60; it’s FBX, but they work the same as GLTF.)

3

Thank you mjurczyk! I’ve solved the issue. I didn’t know you have to reset the animation and play it. I’ve used this function that I later call in the showoff() function:

function fadeToAction( name, duration ) {

const randomNumber = Math.floor(Math.random() * 6) + 1

    previousAction = activeAction
    activeAction = mixer.clipAction(animations[randomNumber]) 

    if ( previousAction !== activeAction ) {

        previousAction.fadeOut( duration )
    }

    activeAction
         .reset()
        .setEffectiveTimeScale( 1 )
        .setEffectiveWeight( 1 )
        .fadeIn( duration )
        .play();
    }
1 Like