Can't get gltf animation to play (but it works in the gltf viewer)

Questions
,
1

Hi! I have a super simple model here:
test.glb (3.8 KB)

It has a simple shape key animation that I created in Blender.

I exported it to gltf, loaded it in my scene, but the animation won’t play and I can’t figure out why. And I know that it should be working because when I view the model in @donmccurdy 's gltf viewer, the animation plays perfectly. Something is wrong with my code and I’m not sure what, there is no errors in the log and it’s all being executed properly.

I’ve used similar code like this before but it was for an armature animation. So maybe I need to do something different because it’s a shape key animation? I really have no idea what’s going on here. Could anyone possibly try running the code themselves and see if you can get it to work?

loader.load(models("./test.glb"), (gltf) => {
    let mixer = new AnimationMixer(gltf.scene);
    let loading = mixer.clipAction(getAnimation(gltf, "loading2"));
    loading.loop = LoopRepeat;
    loading.reset().play();
    scene.add(gltf.scene);
}

function getAnimation(gltf, name){
    var result;
    gltf.animations.forEach((animation) => {
        if (animation.name===name) {
            result = animation
            return
        }
    })
    if (result == null) {
        console.error("animation: "+name+" cannot be found!")
    }
    return result
}
1 Like
2

Are you aware that you have to update the mixer in the animation loop? Since you declare a local variable, I think you are not doing this right now. I suggest you assign gltf.scene to a module scope variable called model, change the scope of mixer and then use this code in the animation loop:

if ( model ) mixer.update( clock.getDelta() ); // clock is an instance of THREE.Clock

I’ve used this code with you asset and it seems to work fine.

1 Like
3

Omg @Mugen87 I can’t believe I forgot to do that. Yes that fixed it. You have no idea how long I was stuck on this. Thank you!