javascript - three.js lookAt函数无法正常工作

我想将一个子对象（圆柱体）与另一个对象（cube2）对齐。我使用了lookAt函数，但是对齐方式不正确。我的错误在哪里？

我有以下代码：

    //cube 1
    var cube=new THREE.BoxGeometry(2,2,2);
    var material=new THREE.MeshBasicMaterial ({ color: 0xffffff });
    mesh1=new THREE.Mesh(cube,material);
    mesh1.position.set(-2,2,0);
    scene.add(mesh1);

    //cube 2
    var cube2=new THREE.BoxGeometry(2,2,2);
    var material=new THREE.MeshBasicMaterial ({ color:0x000000 });
    mesh2=new THREE.Mesh(cube2,material);
    mesh2.position.x=6;
    mesh2.position.y=2;
    scene.add(mesh2);

    //cylinder
    var cylinder=new THREE.CylinderGeometry(1,1,5,30);
    var material=new THREE.MeshBasicMaterial({ color:0xff3399 });
    mesh3=new THREE.Mesh(cylinder,material);
    mesh3.position.x=4.5;


    mesh3.lookAt(mesh2.position);
    mesh1.add(mesh3);

左侧的多维数据集为cube1，右侧的多维数据集为cube2。圆柱体是cube1的子元素，应外观at cube2。因此，如果我移动多维数据集1（在y位置），则圆柱体应该旋转并始终查看多维数据集2。

Here is a picture

最佳答案

LookAt在添加了空格的空间中将网格向vector旋转。

   mesh2.position` is [6,2,0]
   mesh1 position` is [-2,2,0]

如果在mesh1内设置mesh3.lookAt（mesh2.position），它将在向量[6-2,2+2,0] = [4,4,0]上“看起来”；

如果要查看正确的位置，则必须将其计算为目标向量。

见https://threejs.org/docs/api/math/Vector3.html

关于javascript - three.js lookAt函数无法正常工作，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/41677608/