How to export and load Blender 3D mesh with animation to JSON and load it in Three.js r90?

how to import mesh with animation Blender 3D animation to JSON and load from Three.js 90? Maybe anybody have how-to? I can't doing this.

            loader.load( 'models/fox/fox_run.json', function ( geometry, materials ) {

                // adjust color a bit

                var material = materials[ 0 ];
                material.morphTargets = true;
                material.color.setHex( 0xffaaaa );

                for ( var i = 0; i < 1; i ++ ) {

                    var mesh = new THREE.SkinnedMesh( geometry, materials );

                    mesh.matrixAutoUpdate = false;
                    mesh.updateMatrix();

                    scene.add( mesh );

                    mixer.clipAction( geometry.animations[ 0 ], mesh )
                            .setDuration( 1 )           // one second
                            .startAt( - Math.random() ) // random phase (already running)
                            .play();                    // let's go

                }

            } );

enter image description here

It doesn't play animation... enter image description here

After exporting by Three.js r90 exporter I have broken SkinnedMesh. Mesh and Skeleton have offset by Blender configuration, and I have troubles.

enter image description here

ALRIGHT, GUYS! All I need to do is: 1. Pose Mode select: Pose->Clear Transform->All 2. Object Mode select: Object->Clear Location, Rotation, Scale, Origin. And My model exports right from Blender to Three.js using JSONLoader!

Upvotes: 0

Views: 1868

Answers (1)

manthrax
manthrax

Reputation: 5016

Is your animation done with armature key frames on each bone? If you are using IK you may need to bake the IK into the action. Google baking blender IK. In the three export settings, make sure you have skinned mesh and animation, and embed animation checked.. if these things don't help, post a codepen or a jsfiddle. Also make sure your animation is set to loop. It may be finishing the animation before you see it for the first time. Hth.

Upvotes: 2

Related Questions