在 A-Frame 中同时从两个摄像头进行渲染

Question

最近的 v0.3.0 博客文章提到 WebVR 1.0 支持允许“我们在桌面显示器上拥有与头显不同的内容，为异步游戏和观众模式打开了大门。” 这正是我试图开始工作的。我希望场景中的一个摄像头代表 HMD 的视点，另一个摄像头代表同一场景的观众，并将该视图渲染到同一网页上的画布上。0.3.0 删除了将场景渲染到特定画布的功能，以支持嵌入组件。关于如何完成两个相机同时渲染单个场景的任何想法？

我的目的是让桌面显示从不同的角度显示用户正在做什么。我的最终目标是能够构建一个混合现实绿屏组件。

Answer 1

虽然将来可能有更好或更简洁的方法来执行此操作，但通过查看 THREE.js 世界中如何完成此操作的示例，我能够获得第二个相机渲染。

我向一个名为旁观者的非活动相机添加了一个组件。在 init 函数中，我设置了一个新的渲染器并附加到场景外的 div 以创建一个新的画布。然后我在生命周期的 tick() 部分调用 render 方法。

我还没有弄清楚如何隔离这台相机的运动。0.3.0 aframe 场景的默认外观控件仍然控制两个相机

源代码：https : //gist.github.com/derickson/334a48eb1f53f6891c59a2c137c180fa