转换相机小车的有效方法

Question

我目前有一个虚拟现实相机连接到一个小车，以便允许平移和旋转。我试图翻译的小车，基于游戏垫的输入，相对于相机的方向(这是连接到虚拟现实耳机)。

我也在努力避免让小车相对于相机上下颠簸。

我当前的代码如下所示：

this.camerDirectionVector = new THREE.Vector3()
this.camera.getWorldDirection(this.cameraDirectionVector)
this.moveVec.y = 0
this.dolly.translateOnAxis(this.cameraDirectionVector, this.gamepad.axes[0] * this.moveSpeed)

这对移动小车在相机指向的方向(负y旋转)非常有用。

我无法理解的是，如何在额外的游戏垫输入的基础上，将小车“左右”翻译成相对于相机的“左”和“右”。

Answer 1

这是最后对我最有效的解决方案。我从Brian代码中改编了以下代码：https://github.com/brianpeiris/three-firstperson-vr-controls/blob/master/FirstPersonVRControls.js#L125

// Create a dolly
this.dolly = new THREE.Group()
this.dolly.add(this.camera)
this.scene.add(this.dolly)

// Some variables for movement translations
this.dummy = new THREE.Object3D()
this.dummyDirection = new THREE.Vector3()
this.ZAXIS = new THREE.Vector3(0, 0, 1)
this.moveSpeed = 0.075

// Get controller stick positions
const stickForwardBack = this.leftStick[3]
const stickLeftRight = this.leftStick[2]

// In THREE.js when using the WebXR API, the camera rotation will not update to match the headset orientation.
// You'll need to get pose information from the XRSession or get the xr camera using the following method.
const xrCamera = globals.renderer.xr.getCamera(this.camera)
this.dummy.position.set(0, 0, 0)
this.dummy.quaternion.copy(xrCamera.quaternion)
this.collapseY(this.dummy.quaternion)

// Translate the dummy object forwards/backwards left/right relative to the direction the camera is facing
this.dummy.translateZ(stickForwardBack * this.moveSpeed)
this.dummy.translateX(stickLeftRight * this.moveSpeed)

// Add the dummy position to the dolly
this.dolly.position.add(this.dummy.position)

// Flatten out up and down rotation
collapseY(quaternion) {
    this.dummyDirection.set(0, 0, 1)
    this.dummyDirection.applyQuaternion(quaternion)
    this.dummyDirection.y = 0
    this.dummyDirection.normalize()
    quaternion.setFromUnitVectors(this.ZAXIS, this.dummyDirection)
}

Answer 2

基于对这个问题的评论，我想我理解。如果我没有，请留下评论，我会更新这个答案。

我的理解是，你想要能够左右移动，相对于相机，所有这些都不改变小车的up方向。

这实际上比听起来容易，甚至更容易，因为你已经习惯于沿着一个轴进行翻译了。

首先，了解相机有自己的空间参照系，它位于原点，有+Y up方向，它向下看-Z轴。考虑到这一点，您已经知道了“左”和“右”轴：-X (-1, 0, 0)和+X (1, 0, 0)。

但是相机(特别是在虚拟现实中)在世界空间中可能不是很好地对齐，所以你需要把这些漂亮的均匀轴转换成世界轴。Three.js使使用Object3D.localToWorld变得非常容易。

(注意：Object3D.localToWorld对输入Vector3__具有破坏性。)

这里有一个函数来得到世界对齐的左轴：

const getLeftWorld = (function(){

  const localLeft = new THREE.Vector3(-1, 0, 0);

  return function(vectorRef){ // you can give it a vector to overwrite
    let out = vectorRef || new THREE.Vector3();
    out.copy(localLeft);
    camera.localToWorld(out);
    return out;
  };

))();

您可以为“右”轴创建类似的函数。

有了你的新世界左轴在手，你可以翻译沿它的小车，使用你的控制器输入的“速度”。平移不会改变小车的螺距，尽管它可能会改变高度，这取决于相机在计算时的倾斜方式(但你可以像以前一样，在你想的时候把y组件调零)。