为什么在WebXR中错误地计算了光线投射方向?

Cas*_*ius 10 javascript augmented-reality three.js aframe

我试图在基于网络的增强现实应用程序中使用常规的 Three.js光线投射(与AR命中测试相反,这个问题不是关于真实飞机上的命中测试).

Web应用程序使用带有aframe-xr组件的 A-Frame 在WebXR Viewer for iOS和WebARCore for Android中获得WebXR支持,并且增强现实在这两个实验性浏览器中一般都可以正常工作.

但是,它包含aframe-xr三个.xr.jsWebXR polyfill库中的某些内容会导致在具有WebXR支持的实验性浏览器中不正确地投射光线投射的方向向量.光线投射的原点很好(在相机的当前位置),但是方向总是在下方偏移(y坐标太小)并且在它应该的位置稍微向左(x坐标太小)偏移.

巧合(或不是),y似乎A-Frame默认偏移相机偏离1.6米左右.或习惯,因为这似乎已经降级到Three.js最新(未发布)版本,A-Frameaframe-xr取决于工作.

这通常不是光线投射的问题,正如Glitch中的问题再现所证明的那样,我的测试结果如下:

Device/Example run     | Normal 0.7.0   |   WebXR       |   Normal 0.8.0   |
-----------------------|----------------|---------------|------------------|   
Windows Chrome w/mouse |   Correct      |   Correct     |       Correct    |
S8 Chrome              |   Correct      |   Correct     |       Correct    |
S8 WebARCore           |   Correct      |   Incorrect   |       Correct    |
iPad Safari            |   Correct      |   Correct     |       Correct    |
iPad WebXR Viewer      |   Correct      |   Incorrect   |       Correct    |
Run Code Online (Sandbox Code Playgroud)

"正确"表示方向按预期计算,球体出现在我的手指或鼠标光标下方,"不正确"表示方向向量出错,球体出现在错误的位置.

这些示例的代码如下:https://glitch.com/edit/#!/ delirious-watch

WebXR库中发生了什么以抵消计算出的光线投射方向,以及如何修复它?

额外信息:我还在这里用一个单独的故障中aframe-ar组件对此进行了测试.光线投射正常工作在WebARCore在Android(其中,相信是webxr填充工具使用),但不正确的,尽管有不同的iPad上(这里,我相信webxr填充工具在WebXR浏览器偏移使用).

更新:根据下面Roberto的评论,将SITTING_EYE_HEIGHT常量更改webxr-polyfill为0是向正确方向迈出的一步,但不是完整的解决方案.通过这种改变 - 可以在这里尝试 - 如果我在移动或旋转设备之前加载网页并进行光线投射,实际上可以正确计算光线投射方向,但是一旦我移动或旋转设备,光线投射方向就不正确.

小智 4

我对polyfill 代码不太感兴趣(我正在使用iOS 查看器),但我记得polyfill 中的某处有一个SITTING_EYE_HEIGHT 常量。目前设置为 1.1 米。也许您应该使用该值来补偿代码中的高度。这是确切的行: https://github.com/mozilla/webxr-polyfill/blob/e4fa65a9bdb09e8e753014436d2f5b76c949e047/polyfill/XRViewPose.js#L57