Help with Camera zoom in tween

Questions
,
1

Hey again,
So I have my starting point of the model and the end point all I want to do is zoom into the model a bit I have been messing around with tween with camera.position and also controls.target but what ever I try I can not seem to get my head around it
it starts fine and ends exactly where it should end but the tween in between when clicking on the model jumps all over the place would someone help me out with a simple zoom effect where the model ends up here it is at the end after the click:

My pen:

Thank you ! and sorry for the silly questions I am still learning with these libs.

2

After a good read and looking at many questions on this I ended up doing

 controls.enabled = false;
        var xTarget=0;
        var yTarget=0;
        var zTarget=0;
        var tweenDuration=0;

        function panCam(xTarget,yTarget,zTarget,tweenDuration){

          TWEEN.removeAll();

          var camNewPosition= { x : xTarget, y : yTarget, z : zTarget};
          var targetNewPos = {x : xTarget, y : yTarget, z : 0};

          var camTween = new TWEEN.Tween(camera.position).to(camNewPosition, tweenDuration).easing(TWEEN.Easing.Quadratic.InOut)
           .onComplete(function() {
               camera.position.copy(camNewPosition);

                controls.enabled = true;
            })
          .start();
          var targetTween = new TWEEN.Tween(controls.target).to(targetNewPos, tweenDuration).easing(TWEEN.Easing.Quadratic.InOut)
            .onComplete(function() {
                controls.target.copy(targetNewPos);

                controls.enabled = true;
            })
          .start();
          
    }

  
	panCam(0,1,4,3000);

Hope fully this will help new people like me :slight_smile:
panCam(0,1,4,3000); This part of the code will control where the camera animates to also with the duration “3000” 3 seconds

3

Thanks @UI_UNICORN. It is working. But there is a big shaking while tweening. Please help me to solve this