使用三维中的WebGL渲染器点击圈子。

Question

我想在点击它时在对象上放置一个圆圈。

我更新this example以使用webGL渲染器（我基本上将THREE.SpriteCanvasMaterial更改为THREE.SpriteMaterial），但不仅圆圈现在是正方形，而且还会出现问题。宾语。这是一个JSFiddle，用于演示我的问题（单击要测试的对象）。

我在stackoverflow上发现了一些类似的问题，但我似乎无法在我的例子中使它工作。有什么提示吗？

Answer 1

您正在将精灵添加到移动的3D场景中，轻松实现您想要的方法是添加球体

var particle = new THREE.Mesh(new THREE.SphereGeometry(10,10,10),
new THREE.MeshBasicMaterial({color:0xff0000}) );
particle.position.copy( intersects[ 0 ].point );
scene.add( particle );

如果你想要真正的平面圆，你将需要创建一个圆形几何体并将其正确对齐到对象，使其位于矩形墙的顶部，如果你想要在转动对象时不变形的圆，你需要一些自定义着色器的东西