Is there a way to Tween/Animate transitions with OrbitControls ?
Tweening camera directly while using OrbitControls causes jitter effect.
1 Like
Maybe the following fiddle helps: https://jsfiddle.net/u9273yqz/
In general, I would always disable controls when an animation starts and enable it again when the animation is completed. In context of OrbitControls, you have to call the respective update() method to ensure the camera looks at the respective focus point when its position is animated.
All this stuff is implemented in the live example with GSAP 3.
2 Likes
Brilliant. Thank You Mugen87. This works. Your example is perfect. onUpdate:function() {controls.update(); } is the key.
Is there a way to animate the OrbitControls focus point ?
You can animate OrbitControls.target in the same way you do it for camera.position.
1 Like
Works. Outstanding. Thanks Mugen87!
hi Mugen87, I just tried to combine the tween to the OrbitControls.target and the camera.position - however, I could not find the correct way to do so - my controls stay locked as soon as I try to tween to [camera.position, controls.target]…
how do I combine two tweens if they have the same target (lookat and destination)?
how would I combine two tweens if they have different targets?
I tried calling them sequentially, I tried giving an array of two objects to the selector, and I tried calling one from the onComplete of the other - however my controls remain locked afterwards… help please!
okay, actually this approach seems to work in the jsfiddle using [camera.position, controls.target] - however in my code the camera jumps somewhere else as soon as the tween is finished and the controls remain locked - but only if I tween to both parameters. if I just tween to either the cam.position or the controls.target it works fine. very confused…
For animation and orbit controls I reccomend using Yomutsu’s Camera Controls instead of OrbitControls since they are built with animation in mind, whereas with OrbitControls you are fighting against them.
1 Like
I found the mistake in my code - camera pos and lookat where the same target vector which destroyed the orbit controls. now I need to find a way to animate simultaneously to two different targets for two different objects.
EDIT: simply calling gsap sequentially creates a parallel interpolation 
I met a similar problem with you, may I ask if you have solved it? If possible, please show me your solution, which will help me a lot