为什么 Camera 和 Object3D 看起来方向相反？

Question

我有一个基本问题，但我找不到答案。

我注意到以下代码：

const p = new THREE.Vector3();
const q = new THREE.Quaternion();
const s = new THREE.Vector3();

function setPositionAndRotation(o) {
  o.position.set(1, 1, -1);
  o.lookAt(0, 0, 0);
  o.updateMatrix();
  o.matrix.decompose(p, q, s);
  console.log(JSON.stringify(q));
}
const camera = new THREE.PerspectiveCamera(60, window.innerWidth / window.innerHeight, .01, 1000);
var mesh = new THREE.Mesh(new THREE.Geometry(), new THREE.MeshBasicMaterial());
setPositionAndRotation(camera);
setPositionAndRotation(mesh);

<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/97/three.min.js"></script>

为 Camera 和 Object3D 生成不同的四元数：

{"_x":-0.11591689595929515,"_y":0.8804762392171493,"_z":0.27984814233312133,"_w":0.36470519963100095}

{"_x":0.27984814233312133,"_y":-0.3647051996310009,"_z":0.11591689595929516,"_w":

（这是两个在 Z 轴上指向相反方向的四元数。）

问题在于lookAt 函数的行为。我挖掘了 Object3d 的源代码，发现了这个if https://github.com/mrdoob/three.js/blob/master/src/core/Object3D.js#L331

if ( this.isCamera ) {

    m1.lookAt( position, target, this.up );

} else {

    m1.lookAt( target, position, this.up );

}

如您所见，Object3D 的处理方式与 Camera 不同。 target 和 position 互换。

Object3D 的 documentation 说：

lookAt (x: Float, y: Float, z: Float) : null

旋转对象以面对世界空间中的一个点。

但代码却相反。它使用Matrix4的lookAt function

lookAt（眼睛：Vector3，中心：Vector3，向上：Vector3，）：this

构造一个旋转矩阵，从眼睛朝中心看，向上向量定向。

将target 放入eye，并将position 放入center。

我可以处理，但这很奇怪。有没有人能解释一下为什么会这样？

r.97

Answer 1

在three.js 中，未旋转的对象被认为面向其局部正z 轴。

例外是相机，它面向其局部负 z 轴。

此设计决策遵循OpenGL convention。