在A-Frame中同时从两台摄像机渲染

时间:2016-08-25 02:37:27

标签: aframe

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

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

1 个答案:

答案 0 :(得分:4)

虽然未来可能会有更好或更清晰的方法,但我可以通过查看THREE.js世界中如何完成这些操作的示例来获得第二个相机渲染。

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

我还没有弄清楚如何隔离这款相机的机芯。 0.3.0 aframe场景的默认外观控件仍然控制两个摄像头

gif of spectator cam

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