当使用 PointerLockControls 的位置不是 (0,0,0) 时，相机以错误的方式旋转

Question

three.js r91

我改了the PointerLockControls example a little on line 173:

camera.position.set(100, 0, 0);
controls = new THREE.PointerLockControls( camera );
controls.getObject().position.set(100, 0, 0);
scene.add( controls.getObject() );

当我移动鼠标环顾四周时，您会看到相机的旋转不正确-它不是围绕自己旋转而是在其他地方旋转。

你可以看到我添加了controls.getObject().position.set(100, 0, 0);，试图像this and this一样解决问题。但是没用。

有关完整示例，请参阅 this codepen post。

移动鼠标时如何使相机正常绕自身旋转？

Answer 1

尝试删除 camera.position.set(100, 0, 0); 行并保留其他行

Answer 2

我找到了解决办法。

camera.position.set(100, 0, 0);
var cameraPos = camera.position.clone();//save original position
camera.position.set(0, 0, 0);//reset to zero
controls = new THREE.PointerLockControls( camera );
controls.getObject().position.copy(cameraPos);//set original position to the control object
scene.add( controls.getObject() );

这样，camera.position（相机的本地位置）将永远是(0,0,0)，但相机的世界位置是正确的。

当使用 PointerLockControls 的位置不是 (0,0,0) 时，相机以错误的方式旋转

The camera rotates in a wrong way when its position is not (0,0,0) with PointerLockControls

three.js

pointerlock