IntersectObjects - THREE.Line - Three.js

Question

我有一个THREE.Line对象，用于编排自定义网格。现在我遇到的问题是当用户鼠标可能越过这个网格时使用光线投射到intersectObjects时，intercept只有当用户鼠标“直接”越过任何网格线时才会成功。

请参阅附图：

所以我最终想要完成的是，如何用“看不见的”面或甚至形状填充线条之间的空间，以便当用户鼠标越过这个网格时，我可以触发一个动作。这是我正在做的事情：

var response = this.buildGridGeometry(modelStep,modelSize,gridtype);
var geometry = response['geometry'];
geometry.computeBoundingBox();
// #  Setup the material
var material = new THREE.LineBasicMaterial( { color: 0x000000, opacity: 0.2 } );
// #  Draw each individual line
var line = new THREE.Line( geometry, material, THREE.LinePieces );

有什么建议吗？

Answer 1

最简单的解决方案是创建一个与网格形状相同的自定义几何图形，然后使其初始位置，旋转和比例与网格匹配（如果它还没有）。之后，您可以将自定义几何图形作为子项添加到网格中，以便它相应地移动。最后一步是通过设置其属性.visible = false;使自定义几何网格不可见。

现在你只需要在自定义几何网格上使用光线计intersectsObject()，当它相交时，你知道网格也是相交的。