Aframe纸板运动

Question

我希望能够通过环顾四周并按住纸板按钮移动来在我的 VR 世界中移动。我已经试了2个小时了，想不通。我真的不想使用传送作为我的解决方案。

Answer 1

我将其放入框架组件中，并使用 three.js API:

在init检查鼠标是向上还是向下。
在 tick 中，使用 extractRotation(mesh.matrix) 找出作为世界矩阵的旋转，使用 direction.applyMatrix4(matrix) 将其应用于前向矢量，并将其添加到当前相机位置。

AFRAME.registerComponent("foo", {
  init: function() {
    this.mouseDown = false
    this.el.addEventListener("mousedown", (e) => {
      this.mouseDown = true
    })
    this.el.addEventListener("mouseup", (e) => {
      this.mouseDown = false
    })
  },
  tick: function() {
    if (this.mouseDown) {
      let pos = this.el.getAttribute("position")
      let mesh = this.el.object3D
      var matrix = new THREE.Matrix4();
      var direction = new THREE.Vector3(0, 0, -0.1);

      matrix.extractRotation(mesh.matrix);  
      direction.applyMatrix4(matrix)
      direction.add(new THREE.Vector3(pos.x, pos.y, pos.z))
      this.el.setAttribute("position", direction)
    }
  }
})

工作 fiddle here.

Aframe纸板运动

Aframe cardboard movement

aframe