three.js lookAt() ：如何将一些*不是*正 Z 轴的局部轴指向另一个对象答案

【问题标题】：three.js lookAt() : how to point some local axis which *isn't* the positive Z axis towards another objectthree.js lookAt() ：如何将一些*不是*正 Z 轴的局部轴指向另一个对象
【发布时间】：2020-12-11 18:17:01
【问题描述】：

我正在创建一个应用程序，其中一个人（现在我使用的是圆锥形）站在某个表面上（现在我使用的是纵向放置的圆柱体）并且我希望他们的脚能够定向朝向某个点（现在它是圆柱体的中心）。

(edit：我刚刚意识到我在这张照片中的 Z 轴指向错误的方向；它应该指向相机，但是问题保持不变。）

这是一个类似于我想要完成的代码版本。 https://codepen.io/liamcorbett/pen/YMWayJ（使用方向键移动圆锥）

//...

person = CreatePerson();
person.mesh.up = new THREE.Vector3(0, 0, 1);

//
// ...
// 

function updateObj(obj, aboutObj=false){
    let mesh = obj.mesh;
    if (aboutObj) {
        mesh.lookAt(
            aboutObj.mesh.position.x, 
            aboutObj.mesh.position.y, 
            mesh.position.z)
    };
}

//
// ...
//

function animate() {
    // ...

    updateObj(person);

    // ...
}

上面的代码给了我一些类似于我正在寻找的东西，但问题是 lookAt() 似乎总是将本地 Positive Z 轴 指向某个方向，而我' d 更喜欢它指向本地 负 Y 轴。

我宁愿不改变模型本身的 x、y、z 轴，因为当我将其他逻辑应用于 person 对象时，我觉得处理起来会很痛苦。

有没有办法改变lookAt() 使用哪个轴？还是我必须推出自己的lookAt() 函数？谢谢~

【问题讨论】：

标签： javascript three.js

【解决方案1】：

有没有办法改变 lookAt() 使用的轴？

不，3D 对象（不包括相机）的默认本地 forward 向量是 (0, 0, 1)。与其他引擎不同，three.js 不允许配置forward 向量，只能配置up 向量。但这对您的情况并没有真正的帮助。

您可以尝试变换几何体以达到类似的效果。

如果您出于某些原因不想这样做并且仍想使用Object3D.lookAt()，则必须计算不同的目标向量（而不是圆柱体的中心）。

【讨论】：

我也有这个问题，我希望对象的局部x轴指向lookAt坐标。你的建议是找到一个新的lookAt目标？你能描述一下新的 x,y,z 会是什么吗？谢谢！
当我进入 codepen 时，没有运行按钮，它也不会自动运行。我该如何运行它？很抱歉成为 codepen 菜鸟！
[self-explanation] “3D 物体（不包括相机）的默认本地前向矢量是 (0, 0, 1)”：从three.js 代码中我了解到对于相机和灯光，局部前向向量为 (0, 0, -1)。
只有相机有不同的前向矢量。

【解决方案2】：

即使lookAt方法的前向向量不能改变（如@Mugen87所说），你仍然可以事后通过预先知道所使用的前向Z轴与轴的差异来调整局部旋转你认为你的网格是“向上的”（例如：一个站在 Y 轴上的人）。

基本上，在您的情况下，只需在 lookAt 方法之后添加这一行：

mesh.rotateOnAxis( new THREE.Vector3(1,0,0), Math.PI * -0.5 );

锥体会向上看:)

【讨论】：