three.js - 如何在three.js中为球体添加标签

Question

我是three.js 的新手，但这是我想要做的。

我有一个球体..我想在它的表面上添加一个距离（比如）2 个单位的 id 标签。

所以

var geometry = new THREE.SphereGeometry( 50, 25, 25 );
 var draw_object = new THREE.Mesh( geometry, [ new THREE.MeshBasicMaterial( {  color: Math.random() * 0xffffff, opacity: 0.5 } ) ] );

现在我想给它起一个名字“sphere 1”

然后在距离球体表面“x”单位的距离处..为其分配一个标签。问题是这个球体在空间中移动......所以标签必须留在它上面。

从过去两天开始，我一直在尝试，但没有任何运气。

帮助任何

Answer 1

您可能希望使用上面引用的示例中的 Sprite（如何将 Label 添加到 THREE.Mesh？）但是，不是将位置设置为鼠标坐标，而是计算球体的偏移量 - 说它是，例如， (3,4,5) - 并执行类似的操作

label.position.set( sphere.position.add( new THREE.Vector3(3,4,5) ) );

这样，标签的位置存储了对球体位置的引用，并且随着球体的移动，标签将随之移动。