如何将标签添加到 THREE.Mesh？答案

【问题标题】：how to add Label to a THREE.Mesh?如何将标签添加到 THREE.Mesh？
【发布时间】：2016-04-09 03:06:37
【问题描述】：

目标是将鼠标悬停在网格上时将 Three.Mesh 名称显示为标签。我们如何在 Three.js 中做到这一点

谁能给个示例代码？

【问题讨论】：

您是否尝试将文本实际渲染为场景的一部分？它需要是3D文本吗？或者可以用 CSS 在渲染器顶部覆盖 2D 标记吗？此外，您可能希望接受一些以前的答案，否则不会有很多人愿意帮助您。
我只需要标签就像工具提示一样。当鼠标悬停在网格上结束/停止时，最好有标签。在渲染器顶部使用 CSS 覆盖 2D 标记应该没问题。另外请让我知道我的哪些问题/答案仍未被接受。我只是看了看，希望没有一个不被接受。我在 XTK.js API 中看到过这样的标签

【解决方案1】：

接受挑战！

实现这个目标似乎需要三个主要步骤，每个步骤我都分解成更小的示例程序。

(2) 将要显示的文本渲染为图像（我为此使用了画布元素）。见：http://stemkoski.github.com/Three.js/Texture-From-Canvas.html

(3) 在鼠标指针的位置绘制一个包含第 (2) 部分的图像的精灵。见：http://stemkoski.github.com/Three.js/Mouse-Sprite.html

所有这些示例（以及更多示例）都是我在http://stemkoski.github.com/Three.js/ 上不断增加的介绍性示例（带有详细的 cmets）集合的一部分，其中我试图在一系列最小示例中展示 Three.js 的可能性。

另外，值得称赞的是：第 (1) 和 (3) 部分基于 MrDoob 在他的 github 页面上的一些示例，特别是交互式立方体示例：http://mrdoob.github.com/three.js/examples/webgl_interactive_cubes.html

【讨论】：

非常感谢李 Stemkoshi。你的例子很棒而且很有帮助。
@lee 最新版本有什么办法吗...我当前版本的警告和错误...它是 V71
现在有更简单的解决方案吗？例如，如果您在场景中有蒙皮网格并且想要在每个网格的顶部显示名称？现在精灵的问题是它会根据缩放比例放大和缩小。我希望它保持不变。它应该只是跟随周围的网格（保持在头部）。