Empty animations array when importing GLB model

[jcy]

Hi,

Previously when I imported FBX models and try to play it’s animations, I simply had to loop through it’s animation array like this:

   setModelAnimation(object, clipName, model_repeat) {
        this.mixer                  = new this.context.three.AnimationMixer(object);
        this.clipAction             = this.mixer.clipAction(this.context.three.AnimationClip.findByName(this.findAnimations(object), clipName));
        this.clipAction.play();
        
        if (model_repeat == false) {
            this.clipAction.clampWhenFinished      = true;
            this.clipAction.repetitions            = false;
        }
    }
    
    findAnimations(object) {
        const animations = new Array();
        object.traverse(obj => {
            if (obj.animations) {
                obj.animations.forEach(anim => animations.push(anim));
            }
        });
        return animations;
    }

However now when I import the same model but in GLB format, the animation array is empty for some reason. But I’m able to play this model’s animations here:

Creators 3D - Jobs for Professional Artists

The GLB and FBX model can be downloaded here:

model.fbx and 1 more file

Can someone please tell me how can I play GLB model animations in Three JS if the animations array is empty?

Thanks!

[donmccurdy]

When loading a glTF object, the animations are not attached to a Scene or Group object – they’re in an array called .animations in the response object from GLTFLoader. See the glTF documentation, or the source code for this example.

[jcy]

I’m using the Matterport SDK’s included GLTF Loader. Since they also use Three JS as their base, I assumed that their GLTF Loader would function normally like the default loader. This screenshot is what I get returned when I load the GLB model. Is the animations array within this SceneNode object?

[donmccurdy]

Hm, I have no idea what that is sorry – it’s not what THREE.GLTFLoader would normally return at all.