how to smooth transaction with animejs in three js when the target camera position move?

I had a button when the current position was on the top and then it moved to the bottom and centered with Vector3, but it was not smooth, it is like when we do **display: none; to display: block** for my transaction above here,

const setupCameraForPart2 = (propsCameraPart: CameraPropsPart): void => {
  const { center, distance, name } = propsCameraPart;
  if (!name) {
    console.error('Part name is not provided);
    return;
  }
  console.log('Current Position:', _camera.position);
  const targetPosition = new THREE.Vector3(center.x, center.y, center.z + (distance * 1));
  console.log('Target Position:', targetPosition);

  // Animate opacity to 0 first
  anime({
    targets: '.viewport-three-d > canvas',
    opacity: 0,
    duration: 400,
    easing: 'easeInOutQuad',
    complete: () => {
      // After opacity animation completes, animate the camera position
      anime({
        targets: _camera.position,
        x: targetPosition.x,
        y: targetPosition.y,
        z: targetPosition.z,
        duration: 1200,
        easing: 'easeInOutQuad',
        update: () => {
          renderSceneAndCamera();
        },
        complete: () => {
          _camera.lookAt(_scene.position);
          _control.target.set(center.x, center.y, 0);
          _control.update();

          // Animate opacity back to 1 after camera movement completes
          anime({
            targets: '.viewport-three-d > canvas',
            opacity: 1,
            duration: 1000,
            delay: 800,
            easing: 'easeInOutQuad',
            update: () => {
              renderSceneAndCamera();
            }
          });
        }
      });
    }
  });

  _camera.lookAt(_scene.position);
  _control.target.set(center.x, center.y, center.z);
  _control.update();
}

where for the current position camera into the target camera

Current Position: _Vector3 {x: 0, y: 1.3438600897789001, z: 0.4259342574950393}
----
Target Position: _Vector3 {x: 0, y: 1.5364376306533813, z: 0.20977267946690245}

my current function did not have transactions when it was moved to another position, my goal here is to make the transaction when the current and target positions move