Three.js tween mouse position and object

Questions
1

i’m new in three.js
and i want do mousedown event tween event

my tween code is this

      function cameramove(point, target) {


    var from = {
        x: camera.position.x,
        y: camera.position.y,
        z: camera.position.z
    };
      
    var to = {
        x: point.x,
        y: point.y,
        z: point.z
    };
    var tween = new TWEEN.Tween(from)
        .to(to, 600)
        .easing(TWEEN.Easing.Linear.None)
        .onUpdate(function () {
        camera.position.set(this.x , this.y, this.z);
        camera.lookAt(new THREE.Vector3(0, 0, 0));

    })
        .onComplete(function () {
         camera.lookAt(new THREE.Vector3(0, 0, 0));
    
    })
        .start();
};

and my mouse down event is this

function onDocumentMouseDown(event) {
                // event.preventDefault();
              mouse = new THREE.Vector2();     

          
      var rect = renderer.domElement.getBoundingClientRect();
      mouse.x = ( ( event.clientX - rect.left ) / rect.width ) * 2 - 1;
      mouse.y = - ( ( event.clientY - rect.top ) / rect.height ) * 2 + 1;
      
       var vector = new THREE.Vector3(mouse.x, mouse.y, 0.5);
        vector = vector.unproject(camera);
        var raycaster = new THREE.Raycaster(camera.position, vector.sub(camera.position).normalize());
        var intersects = raycaster.intersectObjects(scene.children, true);

        if (intersects.length > 0) {
              var dd = scene.getObjectByName(intersects[0].object.name);
              const a = intersects[0].point;
              console.log(a);
               cameramove(a, dd);
 }
}

When you go to a certain point, the camera is rotated and zoomed in too close to the object. I need help if I know how to do this. I’ve been doing this for a few days.

2

Hi!

Does it mean that you have just one object in the scene and it’s always in the center of the scene?
If so, it’s better to do like that camera.lookAt(target.position); or camera.lookAt(scene.position);.
Moreover, if I got it correctly, you tween the position of the camera right to the point of intersection, that’s why you got such unusual zoom in.
Try to use the normal in the point of intesection and use it to put your camera at some distance.

Anyway, it would be great, if you provide a live code example :wink:

3

hello

I have several objects.
My code has the ability to add objects. I found a way to align the center with the control. However, since it moves from the first point to the camera, there is a feeling that the starting point starts slightly behind. Is there a way to solve this?