CODEWITHSUNDEEP
three.jsgsap
Toni Gallardo
Toni Gallardo

Reputation: 95

Animate camera horizontally three.js

I'm doing a camera animation in Three.js with GSAP, I'm trying to animate it horizontally like the panning in a film. Anyone knows if is possible to animate the pan in orbit controls or something similar?

Upvotes: 0

Views: 346

Answers (1)

Mugen87
Mugen87

Reputation: 31076

If you are using OrbitControls and you want to manually animate a pan, you have to animate the camera position and OrbitControls.target which represents the focus point of the controls. The relevant code for the controls is:

gsap.to( controls.target, {
    duration: 2,
    x: 10,
    onUpdate: function() {
        controls.update();
    }
} );

Full demo: https://jsfiddle.net/kerpm61q/

Upvotes: 2

Related Questions