3D Model from Blender and use Shape Keys

Questions
, ,
1

I export a 3D Model from Blender and use Shape Keys to move a group of vertices. Everything works fine in Blender.

I export in glTF format and manage my group through morphTargetInfluences.

The vertices are shifted correctly, but the scale of the entire model changes. I can’t understand why and how to solve it?

 let loader = new GLTFLoader();
    let object;
    let gui= new dat.GUI();
    let options={morph:0};

      loader.load('assets/3.gltf',(gltf)=>{
        object=gltf.scenes[0].children[0];
        this.scene.add(object);
        let morphChange=()=>{
          object.morphTargetInfluences[0]=options.morph;
        };
        gui.add(options,'morph',0,1).onChange(morphChange);
    });
2

Can you please demonstrate the issue with a live example? Or maybe share your code as a git repository? I’m afraid it’s not possible to find the root cause with your provided code snippet.

3
1 Like
5

6

The model looks OK here:

https://gltf-viewer.donmccurdy.com/#model=https://rawcdn.githack.com/BeilinD/TestMorph/fe1b8c23a48ecdc7219da608a621945e9bb32b23/src/assets/3.gltf

Screen Shot 2020-01-06 at 8.12.22 AM
Screen Shot 2020-01-06 at 8.12.22 AM2880×1652 805 KB

Does that look correct?

1 Like
7

Yes, that’s correct. It seems like a problem is in my code

8

I think I’ve found the issue. Please import GLTFLoader and other three.js modules like OrbitControls from the official repo like so:

import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js';

You currently use the npm package three-gltf-loader which might use outdated code not compatible with the latest three.js version. After this change, everything works as expected.

2 Likes
9

It is fantastic!
It works!
Thank you very much!
I am very grateful!

1 Like