threejs - 使用 ObjLoader 加载和进行光线投射时鼠标拾取不准确

【问题标题】：threejs - inaccurate mouse picking when loading using ObjLoader and doing raycastingthreejs - 使用 ObjLoader 加载和进行光线投射时鼠标拾取不准确
【发布时间】：2018-08-05 17:44:25
【问题描述】：

我想在用鼠标单击时在网格中选择一个面。使用 ObjLoader 和 MtlLoader 加载网格（附加）单击网格时，有时会检测到交叉点，但有时不会。

附加的here 是一个基于 webgl_interactive_cubes.html 和 .obj 文件的小型独立示例。如果将变量 loadCubes 设置为 true，则原始示例按预期运行，即检测到交叉点。如果将变量 loadCubes 设置为 false，则加载 obj 文件但未检测到交叉点。

谢谢，阿夫纳

附言我看过的相关链接：类似问题描述：here和here、code pattern、raycasting documentation

【问题讨论】：

请在您的帖子中包含您的代码。
解决方案是对已接受的答案 1 中所述的代码进行 2 次调整。添加了“mtlLoader.setMaterialOptions({side: THREE.DoubleSide});”还有“child.material.side = THREE.DoubleSide;”当调用 objLoader.load - 这会显示材质的两面） 2. 调用“var intersects = raycaster.intersectObjects(scene.children, true);”检查对象的后代。谢谢。

标签： three.js

【解决方案1】：

THREE.Raycaster() 有 .intersectObjects ( objects, recursive ) 方法。

文档说明了这个方法的参数（如果你仔细看的话）：

objects — 检查与射线相交的对象。

recursive — 如果为真，它还会检查对象的所有后代。否则它只检查与对象的相交。默认为假。

THREE.OBJLoader()，返回THREE.Group() 对象，在其.children 属性中包含THREE.Mesh() 对象。

所以你的交叉点检查应该是这样的：

var intersects = raycaster.intersectObjects( scene.children, true );

【讨论】：