Three.js: FBX animation not working

[gyomihaly]

(* This section is for bug reports and feature requests only. This is NOT a help site. Do not ask help questions here. If you need help, please use stackoverflow. *)

Description of the problem

Panorama_foranimation.zip

I've been stuck with this file for weeks now, the new FBXLoader updates solved the skeleton parsing exceptions but the animation still doesnt play.

The relevant code:

            var loader = new THREE.FBXLoader();
            loader.load('images/xsi_man_skinning.fbx', function (object) {
                mixer = new THREE.AnimationMixer(object);
                mixers.push(mixer);
                mixer.clipAction(object.animations[0]).play();
                markerObject3D.add(object);
            });

And the animate method:

  function animate() {
            requestAnimationFrame(animate);
             ...
            if (mixers.length > 0) {
                 for (var i = 0; i < mixers.length; i++) {
                   mixers[i].update(clock.getDelta());
                  }
             }
 render();

The interesting thing is that this code works perfectly with the webgl_loader_fbx model, xsi_man_skinning.

Also could you add some guidelines or documentation for 3D animators? Since I'm programmer I don't always understand Maya or Blender specific problems and I can't tell my animator what is he doing wrong and how should he do it instead.

Thanks for all the updates guys, you're doing a really awesome work!

Three.js version

• [x] Dev
• [ ] r84
• [ ] ...

Browser

• [x] All of them
• [ ] Chrome
• [ ] Firefox
• [ ] Internet Explorer

OS

• [x] All of them
• [ ] Windows
• [ ] Linux
• [ ] Android
• [ ] IOS

Hardware Requirements (graphics card, VR Device, ...)

[Kyle-Larson]

I'll take a look at this when I get home tonight.

[Kyle-Larson]

Edit: Re-read the original comment. Need to look at the animation. Sorry, sleepy dev I am.

[gyomihaly]

Thanks for the fast response!
I'm not in a hurry with this project, please don't strain yourself because of it.
Until I changed to dev version from r84 three days ago, I got an undefined exception in parseSkeleton. I tried to manually compare it to xsi_man_skinning, and i have a feeling this has to do something with RotationPivot and ScalingPivot but i don't understand throughly how the loader parse fbx files.

[dill0wn]

I'm seeing the same issue using my own .fbx file.

[mrdoob]

@dill0wn do you mind sharing the fbx file?

[dill0wn]

Sure, sorry for the delay, I had to get approval.

mars_character_animation_textures.fbx.zip

(Unrelated, This fbx also has 'embedded textures' which also aren't showing up with the loader, but I should probably create a separate issue for that.)

[mrdoob]

/ping @takahirox

[realalchemist]

I Think I have tje same problem, but was able to fix it. Heres the way I figured it out:

The xsi_man_skinning.fbx uses the bound mesh name with a colon as a prefix in order to work. Additionaly some of the programs (I am using C4d, are not able to export bind pose models for skinned meshes)

1. for each bone bound to a mesh, prepend the mesh name with a colon, in order to get it to work. This solved the animation issue for me
   Example:

- XSIMan:Man // <- this is the mesh
    - XSIMan:UpperBody
        -XSIMan:SpineStart1

1. In case you get a "cannot read property of undefined" exception (as I got it) there is a bug in the FBXLoader Implementation. The nullchecks are not defensive enough. If a FBX contains Skins but not bindpose, loading the animations will not work because of this:
   The mentioned line is this here:
   https://github.com/mrdoob/three.js/blob/dev/examples/js/loaders/FBXLoader.js#L1978

var BindPoseNode = FBXTree.Objects.subNodes.Pose;
// other code
// ...
if ( BindPoseNode ) {

    var PoseNode = BindPoseNode.subNodes.PoseNode;
    var worldMatrices = new Map(); 

   //^ above is the important part, worldMatrices will only be set, if BindPoseNode is defined

}

for ( var FBX_ID in deformers ) {

    var deformer = deformers[ FBX_ID ];
    var subDeformers = deformer.map;

    for ( var key in subDeformers ) {
        // Other code
        // ...

        // worldMatrices === undefined || ! worldMatrices.has( bone.FBX_ID ) fixes the problem, as it breaks if there is no BindPoseNode
        if ( ! worldMatrices.has( bone.FBX_ID ) ) {

            break;

        }


        var mat = worldMatrices.get( bone.FBX_ID );
        bone.matrixWorld.copy( mat );

    }
}

@mrdoob Is this the right issue for this problem?

[looeee]

In case you get a "cannot read property of undefined" exception

@DieAlchemistenAG I have a PR ready that fixes this bug. Will submit once a couple of other PRs are merged to prevent conflicts.

[realalchemist]

@looeee Thanks for that!

[looeee]

@DieAlchemistenAG #12479 :grin:

[mrdoob]

@looeee should this be closed?

[looeee]

@mrdoob no - animation in the Panorama_foranimation model still doesn't work.

[looeee]

@mrdoob @gyomihaly I finally tested the Panorama_foranimation model - I was able to get the animations to play by re-exporting this from 3DS Max with the "bake animations" setting checked.

The loader currently doesn't play any animations for files exported without baked animations. I plan to test whether it's possible to support "un-baked" animations at some stage, but for now I think this can be closed.