A帧在2d平面上镜像我的div中的代码



问题

我正在使用a帧创建一个三维场景(https://aframe.io)我需要某种方法将htmldiv镜像到a框架内的平面上。例如,假设有一个div,其中包含一些代码,我可以在上面绘制类似于屏幕左下角白板的内容。我在白板上画的所有东西都应该镜像到a框架平面上。这样,我就可以在a帧场景中看到我的白板绘图。

我尝试过的

我尝试过使用两个组件:a框架html嵌入组件(https://github.com/supereggbert/aframe-htmlembed-component)和a帧着色器组件(https://github.com/mayognaise/aframe-html-shader)两者都用于在2d平面上显示我的场景中的html,然而我的场景的2d平面没有镜像白板,也没有更新。这意味着,当我在白板上画东西时,不是镜像到2d平面上并显示我在vr中画的东西,而是一块白板上什么都没画。

我需要解决的问题和理想的解决方案

我需要能够在html中创建一个带有白板或其他代码的div,并在我的场景中的2d平面上显示相同的html。平面上的2d html应该更新意思,如果我画字母";a";在我的白板上,字母a将出现在我的场景中的2d平面上。只要有一个div,我就可以把我的2d html(我的白板(和div镜像放在vr中,这将是理想的解决方案。有什么代码可以做到这一点吗?

我是否在尝试实现这一目标的两个组成部分中遗漏了什么?(两个组成部分:https://github.com/supereggbert/aframe-htmlembed-component和https://github.com/mayognaise/aframe-html-shader)或者可能是一个不同的a型架组件?

理想情况下,我正在寻找一个组件的代码,该组件允许我将div镜像到场景中的三维平面上,或者推荐一个组件,允许我在二维div上显示可交互内容。

由于白板使用画布,因此可以使用aframe画布组件。

然后在handleUpdate()函数结束时,您希望调用组件的updateTexture()函数,将aframe纹理更新为白板的当前状态。

最新更新