javascript - Threejs 渲染器上的 2D GUI

Question

我在渲染器上创建 2d gui 时遇到问题。2d gui 必须根据元素宽度动态定位，该宽度是在 Threejs 中绘制的(元素的宽度 X 使用 Threejs 单位，菜单必须定位在其最右侧 50px 等)。

有办法实现吗？使用 Sprite 或使用 DOM 元素直接在渲染器上绘制？

Answer 1

是的，使用 DOM 元素，这是唯一的方法(据我所知， Sprite 使用图像)，除非您需要在 3D 中移动元素，这需要 css 渲染器。

• 如果对象的几何图形还具有 width 属性，则使用它

• 否则计算边界框以获取它；

然后您只需要找到合适的乘法因子将该值转换为像素以适合您的布局