Shape Keys work in Blender as expected, display incorrectly in three.js

[mattg73]

Hi

Following up on this tweet:

https://twitter.com/donrmccurdy/status/916163018827882496

Blender 2.78c, Three.js r87

We have an animated mesh that uses both armature and shape keys for animation. We are using the gltf Blender exporter and importing into three.js for display.

Armature animation comes through fine but shape key (morphTarget in three.js terminology) influence animation seemed to only be partially behaving as expected. We see only partial morph target influence being displayed, inconsistencies on timing, and visual fluttering glitches as morph targets rapidly toggle on and off. The suspicion is that morph target animation data is incorrectly indexing the wrong morph target.

Reducing the morphtargets down from 8 to 1 removed the issue but as soon as we added additional morphtargets back in, and used a test animation that played them sequentially, the order of the animation sequence would change as follows:

Blender Shape Key animation in timeline order:
A, B, C, D, E, F, G

Three.js Morph target animation order:
B, A, C, E, D, F, G

(1,2 and 4,5 switched order)

Neither of these matched the listed order of Shape Keys in the Blender shape key window

We are not able to share the model at the time of posting but these are the export settings used in the gltf export window:

[UX3D-nopper]

Is it possible to reproduce this in a simpler model? Could you provide this one?
Otherwise it will be hard investigating this.

[mattg73]

We haven't been able to reproduce in a simpler model, is it possible to share the problematic file with the dev team privately? We can't post it into a public forum at the moment

[UX3D-nopper]

@donmccurdy Don, can you please get in touch with @mattg73 and check, if this is a three.js problem?
I think it is related to the Project Polly animation problem, where skinning and morphing is mixed.

You can also send the file us: [email protected]
We will check it with our renderer.

[donmccurdy]

This could be mrdoob/three.js#12368, too. I'll try to fix that soon. I would also be glad to discuss and debug offline: [email protected]

[mattg73]

Thanks both for the offer of assistance, we think we've tracked the problem down to principally not a gltf exporter bug :-)

Importing a FBX with Morph Targets/Shape Keys into Blender from Lightwave results in seemingly random order of Shape Keys (even with the same FBX), both in the properties panel and in the F-curve editor (also different from each other).

In Blender the animation plays fine with all Shape Keys and attributed animation curves. Exporting to GLTF (glb or gltf) results in mismatched Shape Keys to animation curves.

To correct, the imported FBX's Shape Key order in the Properties panel much match that in the F-curves editor, this is random each time but, as long as they match, the right animation curves are assigned to the right Shape Keys/Morph Targets when exporting to GLTF.

I suppose it would be useful for the gltf exporter to check for a mis-match between the shape key order in properties panel and F-Curves editor but I can understand this is not strictly a responsibility for the exporter to address.

Hope this post helps others who might encounter the problem but apologies for misidentifying as an exporter bug

[ashorey-zspace]

I had this issue of jumbled shape keys with imported .fbx files from Maya. Somewhere along the line, trying to get to the bottom of it, I realized it wasn't happening any more. Turns out the issue is present in the official 2.79 release of Blender, but if you grab Blender's source and compile it yourself, the issue is gone. Not sure what's different, but it sure saved me some work.

[VrGameDevGirl1984]

I had this issue of jumbled shape keys with imported .fbx files from Maya. Somewhere along the line, trying to get to the bottom of it, I realized it wasn't happening any more. Turns out the issue is present in the official 2.79 release of Blender, but if you grab Blender's source and compile it yourself, the issue is gone. Not sure what's different, but it sure saved me some work.

Hello! I just came about this issue! I really need to find a fix because I need to share my blendshapes in Unity with other characters and because the blendshapes/Shape keys come over into Unity all random each time on the characters its impossible. Please share the compiled version that works? Thanks!

[donmccurdy]

@VrGameDevGirl1984 could you test the new Blender 2.8 beta? glTF export is included by default: https://www.blender.org/2-8/

[VrGameDevGirl1984]

@VrGameDevGirl1984 could you test the new Blender 2.8 beta? glTF export is included by default: https://www.blender.org/2-8/

I did download it and tested it but i'm not sure how to use the gITF exporter. I just did normal export and still had the same random shape key results come over into Unity.

[pranav-ap]

Hi, Any updates on this issue?

[donmccurdy]

I no longer have a model to reproduce this issue – development has moved to a new repository (https://github.com/KhronosGroup/glTF-Blender-IO) based on this exporter and an existing importer. If the problem still occurs in the new exporter + Blender 2.8, let's reopen the issue there.