【发布时间】：2012-02-24 13:01:39
【问题描述】：
我正在使用 Three.js 在画布元素中使用 webgl 创建一些 3D 图形。是否有一个不错的库可以在 3D 图形的顶部绘制 2D 元素。类似于 3D 游戏的 HUD。我想在屏幕上的 3D 东西上绘制一些图像或文本。有任何想法吗？可以用 Three.js 完成吗？
【问题讨论】：
标签： html graphics canvas 2d three.js
【发布时间】：2012-02-24 13:01:39
【问题描述】：
您会在他的示例中注意到，当他覆盖 2D 对象时，他只是使用了其他 HTML 元素：http://mrdoob.github.com/three.js/examples/webgl_multiple_canvases_grid.html
为自己做同样的事情可能是值得的，在 3D 顶部的一个完全独立的 2D 画布控制 HUD。不过，这种方法存在一些与鼠标事件相关的问题，因此它更准确地取决于您的需求。
【讨论】：
-
我相信这将是正确的选择。他可以使用诸如 jQuery UI 之类的库来实现交互功能（可拖动、可放置、可调整大小、可选择和可排序）以及它附带的所有其他功能。事实上，我不会创建另一个画布，而是在画布上创建一个图层。
-
我同意 Alerty，但我不会基于 jquery 创建 ui，因为 JavaScript 对于 webgl 来说足够慢；考虑到 webgl 仅受现代浏览器支持（它们也支持 CSS3）这一事实，我会选择基于新的 html5 技术和非常薄的 JavaScript 层的轻量级 UI。