当使用THREE.Line时，三个交叉的CircleGeometry工作，但在使用THREE.Mesh时则不行

Question

请参阅以下小提琴：

https://jsfiddle.net/1jmws2bp/

如果你将鼠标移动到线条或圆圈上，它应该将颜色改为白色（适用于我，本地，在jsfiddle，有时会有一点偏移，不完全确定原因）。

问题是，如果你改变第22行：到var circle = new THREE.Mesh(geometry, material)，圆圈就会被填满（如预期的那样），但如果你现在将它悬停，它就不会更新颜色。

为什么？如果我手动添加： scene.children[0].material.color.setHex(0xff0000);

确实有效。所以不知何故，我认为使用Mesh，RayCaster看不到交叉点。 （通过添加此行验证 alert("intersection"); if (intersects.length > 0) Mesh如果我使用Line代替{{1}}，则无法提醒

Answer 1

如果要与圆的网格相交，请从geometry.vertices.shift();函数中删除第newCircle()行。

当您调用.shift()时，将从顶点数组中删除第一个元素。这样＆＃34;转移＆＃34; THREE.Line()可以接受几何体中的数组，因为它只需要顶点，但THREE.Mesh()不能接受，THREE.Mesh()需要基于顶点的顶点和面。

此外，如果您想使用THREE.LineBasicMaterial()，请将材料从THREE.MeshBasicMaterial()更改为tf.nn.rnn()。