threejs mixer not updating with `setTime`

Viewed 954

I have a threejs animation mixer set up as follows:

this.mixer = new THREE.AnimationMixer(this.object);
this.mixer.timeScale = 2; //play twice as fast
this.mixer.addEventListener('finished', this.handlePullAnimFinished);
this.pullAnim = this.mixer.clipAction(this.animations[0]);
this.pullAnim.clampWhenFinished = true;
this.pullAnim.setLoop(THREE.LoopOnce);
this.pullAnim.enable = true;

but if I try to do something like this.mixer.setTime(0.5), followed, optionally, by this.mixer.update() nothing happens

How do I programmatically set the mixer to a specific point in an animation (and not have it autoplay)?

I've seen the documentation here on setting up animations to autoplay (and successfully gotten that to work)

2 Answers

At first glance it looks like your mistake is that .update() does not have any arguments in it.

According to the docs, the mixer expects the update method to receive a change in seconds on each frame.

According to this demo you can do something like this:

var clock = new THREE.Clock();

function animate() {
    var dt = clock.getDelta();
    mixer.update( dt );
    renderer.render( scene, camera );
    requestAnimationFrame( animate );
}

you could try this:

// r3f version
useEffect(()=>{
    action.play()
}, [])

useFrame(()=>{
    mixer.setTime(.3)
})

// vanilla version
actions['EmptyAction.001'].play()

let time = .3
animate(){
    mixer.setTime(time)
    requestAnimationFrame(animate)
}
animate()
Related