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，）：这个

构造一个旋转矩阵，从眼睛到由上矢量定向的中心。

将target放入eye，然后将position放入center。

我可以解决，但这很奇怪。有谁能够解释为什么会这样？

r.97

Answer 1

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

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

此设计决定遵循OpenGL convention。

为什么Camera和Object3D的方向相反？

1 个答案: