Javascript 在摄影机视图中使用无嵌套的A帧生成实体

如何直接在摄影机视图中生成实体而不将其嵌套为子节点

我试图在某些情况下在用户面前生成立方体，即使相机移动到特定的虚拟现实设备（如硬纸板）上，立方体仍保持在绝对位置

一个常见的嵌套示例：

<a-camera position="0 1.6 0">
    <a-box position="0 0.5 -1"></a-box> <!-- Unclickable button on cardboard -->
</a-camera>

默认摄影机视图的普通按钮示例为：

<a-box position="0 0.5 -1"></a-box> <!-- Clickable button on cardboard-->
<a-camera postion="0 1.6 0"></a-camera>

上面的代码是一个简化版本，不包含按钮交互，因为它们与问题无关。

如果要将“屏幕坐标”转换为场景“3D世界坐标”，three.js可以帮助：

// x, y are screen coordinates, but rescaled to <-1 : 1>
var position = new THREE.Vector3( x, y, -1 ).unproject( camera );

就像我做的一样（“foo”组件，红色框，尽管我必须沿着计算的方向移动它）

---

---

另一方面，如果您正在进行UI，那么如果您只是创建一个响应性HTML覆盖，您将为自己节省大量的麻烦。如果是“VR UI”，则尝试在相机前面创建“菜单区”，而不是固定的菜单。

如果提供完整的代码来显示您的尝试，则可以更轻松地提供帮助和建议解决方案。太好了，给你。我尽力通过代码来表达这个问题，如果太不清楚，我道歉。

x = ((positionOnScreen - screenWidth/2) / screenWidth/2)