Three.js A帧屏幕到世界位置

我正试图通过一个框架将鼠标位置转换为三分之一的世界坐标

使用类似

let mouse = new three.Vector2()
let camera = document.querySelector('#camera')
let rect = document.querySelector('#sceneContainer').getBoundingClientRect()
mouse.x = ( (event.clientX - rect.left) / rect.width ) * 2 - 1
mouse.y = - ( (event.clientY - rect.top) / rect.height ) * 2 + 1

let vector = new three.Vector3( mouse.x, mouse.y, -1 ).unproject( camera )

然而，它似乎无法处理相机，我明白了

TypeError:无法读取未定义的属性“elements”

从Matrix4.getInverse

9550 | 
 9551 | // based on http://www.euclideanspace.com/maths/algebra/matrix/functions/inverse/fourD/index.htm
  9552 | var te = this.elements,
> 9553 |    me = m.elements,
  9554 | 
  9555 |    n11 = me[ 0 ], n21 = me[ 1 ], n31 = me[ 2 ], n41 = me[ 3 ],
  9556 |    n12 = me[ 4 ], n22 = me[ 5 ], n32 = me[ 6 ], n42 = me[ 7 ],

---

我认为它没有正确读取相机，如果这是问题的话，有没有关于如何从A帧相机中取出三个相机的想法？

使用Piotr关于访问相机并将“三”调整为“三”的信息似乎有效：

---

访问摄像头：z=-1来自何处？z=-1来自何处？此值没有意义，因为函数需要矢量2，z值可以是任意值。

AFRAME.registerComponent('mouse-to-world', {
  init: function () {
    document.addEventListener('click', (e) => {
      let mouse = new THREE.Vector2()
      let camera = AFRAME.scenes[0].camera
      let rect = document.querySelector('body').getBoundingClientRect()
      mouse.x = ( (e.clientX - rect.left) / rect.width ) * 2 - 1
      mouse.y = - ( (e.clientY - rect.top) / rect.height ) * 2 + 1
      let vector = new THREE.Vector3( mouse.x, mouse.y, -1 ).unproject( camera )
      console.log(vector)
    })
  }
});