How to handle and play a skeletal animation in three.js in its last version

Question

I know there is the skinning_blending model but as it has the gui control (the dat.gui as for all other threejs examples) so the code became too complexe and i couldn't get the simple way like which i found for a previous older threejs version like this one :

                var loader = new THREE.JSONLoader();
                loader.load('../assets/models/simpleManMesh2.json', function (model, mat) {

                   var mat = new THREE.MeshLambertMaterial({color: 0xF0C8C9, skinning: true});
                    mesh = new THREE.SkinnedMesh(model, mat);


                    // register the animation
                   THREE.AnimationHandler.add(model.animation);

                   var animation = new THREE.Animation(mesh, "saluuut");

                    scene.add(mesh);

                    // start the animation
                    animation.play();

                }, '../assets/models');

for which and same as many other people i got the error :

THREE.AnimationHandler.add() has been deprecated.

So what i ask for is a same simple code (without any gui control) but which works in the lastest version. Best regards.

score 2 · Accepted Answer · answered Aug 15 '15 at 11:35

2

It just now is THREE.Animation() :

loader.load('yourfile.json',function(geometry,materials){
    for(var i in materials)materials[i].skinning=true;

    mesh=new THREE.SkinnedMesh(
        geometry,
        new THREE.MeshFaceMaterial(materials)
    );
    scene.add(mesh);

    animation=new THREE.Animation(mesh,geometry.animations[0]);

    animation.play();
});

answered Aug 15 '15 at 11:35

Mouloud85

3,826
5
22
42

Thanks, but the animation doesn't play, only the mesh was displayed and no errors are mentioned. Here are my files http://pastebin.com/7iNTjN4K and http://pastebin.com/nhfCTETm – Bardelman Aug 15 '15 at 13:25
2

because in your `render` function you have `if(animmesh)THREE.AnimationHandler.update(clock.getDelta);`, in the code above you pasted you need to change `mesh` to `animmesh` so the animation updates. – Mouloud85 Aug 15 '15 at 14:24

How to handle and play a skeletal animation in three.js in its last version

1 Answers1