JSONLoader raycaster和碰撞网格-three.js

Question

我正在使用raycaster来查看是否用鼠标（或触摸）击中了物体细的物体，并且可以通过增加与射线相交的物体的尺寸来做到这一点。 与游戏对象一样，（使用three.js）我可以添加自己的碰撞网格物体，该网格物体显然不会渲染，但会触发Ray吗？

因此，当我的射线照射到与原始网格物体相关联的（不可见的）粉红色圆柱体时，它将触发相交。

我不能简单地使另一个与原始网格分组并使其可见=假的网格； 或不透明度= 0; 那行不通。 我正在寻找“内置”的东西（如果存在）

非常感谢

Answer 1

您想在场景中添加一个碰撞网格，以响应光线投射，但不渲染。

为此，将您的碰撞网格物体添加为网格物体的子级，并将碰撞网格物体的材质的可见性设置为false。

collisionMeshMaterial = new THREE.MeshBasicMaterial( {
    visible: false
} );

碰撞网格物体不会渲染，但会响应光线投射。

three.js r.74

Answer 2

您可以维护可单击网格的集合，而无需将其添加到场景中。 然后仅对该集合进行raycaster.intersectObjects(collection); ： raycaster.intersectObjects(collection);

但是，您可能必须使它们与父对象“同步”。