WebGL：如何使交互式div例如文本输入在某些Web gl 3d对象上绘制并且仍然是交互式的？

问题描述

| 因此，我查看了https://github.com/mrdoob/three.js/示例，但是我看不到将html交互式表单（带有CSS和其他内容）绘制到某些Web gl对象上的方法...因此，任何人都可以提供一个如何将一些交互式html输入表单绘制到球体或立方体上的示例？ 更新： 其实有一个很好的示例，带有视频示例http://mrdoob.github.com/three.js/examples/canvas_materials_video.html 因此，有可能在具有样式的现实世界html div上尝试...     

解决方法

好吧，您不能只在对象上放置一些“ 0”元素。这些对象在Canvas元素中绘制。您显示的视频示例是皮肤，并且在每次调用render（）函数时将其绘制到您看到的表面上。因此，您基本上必须将元素放置在画布上方： canvas元素上的HTML文本字段 或制作一个完全自定义的交互式3D空间： http://mrdoob.github.com/three.js/examples/canvas_interactive_voxelpainter.html 或者找到一种将输入元素直接绘制到Canvas上的方法，但是我不认为这可以实现...     ,到目前为止，还没有办法在WebGL中或在2D画布上绘制HTML元素（在Firefox扩展之外）。如果要使用3D元素，最好的选择是使用CSS 3D变换来变换HTML位并将其放置在WebGL画布的前面。 另一种方法（读：工作太多）是编写自己的输入小部件并进行自己的事件映射。     ,这不是WebGL，但这是3D空间中iframe的一个很好的示例/教程。 http://www.html5rocks.com/tutorials/3d/css/ 您可以使用相同的CSS 3D变换在其周围构建一个简单的“ 3D”世界。