Thursday, December 17, 2020

Three JS Animation Mixer

The AnimationMixer is a player for animations on a particular object in the scene. When multiple objects in the scene are animated independently, one AnimationMixer may be used for each object.


Below is how animation mixer can be used. In this each individual object is having animation. Once the objects are loaded, they are added to the AnimationMixer. The clip actions play it. 


 const model = gltf.scene.children[0];

    model.position.copy(position);


    const animation = gltf.animations[0];


    const mixer = new THREE.AnimationMixer(model);

    mixers.push(mixer);


    const action = mixer.clipAction(animation);

    action.play();


    scene.add(model);


References:

https://threejs.org/docs/#api/en/animation/AnimationMixer

No comments:

Post a Comment