javascript - 如何将标签添加到 THREE.Mesh？

Question

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

有人可以提供示例代码吗？

Answer 1

接受挑战！

工作代码示例位于： http ://stemkoski.github.com/Three.js/Mouse-Tooltip.html

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

(1) 确定鼠标指向哪个场景元素。见：http ://stemkoski.github.com/Three.js/Mouse-Over.html

(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/上不断增加的介绍性示例（带有详细评论）集合的一部分，我试图在其中展示 Three.js 的可能性在一系列最小的例子中。

另外，应得的信用：部分（1）和（3）基于MrDoob在他的github页面上的一些示例，特别是交互式多维数据集示例：http ://mrdoob.github.com/three.js/examples/webgl_interactive_cubes .html