使用 raycaster intersectObjects - Three.js 获取网格面的法线答案

【问题标题】：Obtaining normal of the mesh face using raycaster intersectObjects - Three.js使用 raycaster intersectObjects - Three.js 获取网格面的法线
【发布时间】：2014-03-05 21:00:40
【问题描述】：

我尝试使用以下方法获取网格面的法线：

ray = new THREE.Raycaster(x, y); 
var intersection = ray.intersectObjects(objectsOptical, true);
var vector = intersection[0].face.normal;

添加了intersection[0].point 和intersection[0].face.normal（乘以常数）作为一个顶点和intersection[0].point 作为一条（灰色）线的第二个顶点。我得到了这个（红线是光线，灰色应该是法线 - 但它们不是）： Illustrative image

请帮我获取网格 FACE 的 NORMALS。

谢谢。

【问题讨论】：

标签： three.js intersection normals raycasting

【解决方案1】：

您用红线绘制的法线看起来可能是正确的，考虑到透视投影。

光线投射测试从您的网格中击中单个三角形面。您所指的法线是光线击中的面部对象的法线，即。从原始网格。

在source code for THREE.Raycaster中可以看到交集计算直接返回人脸。

在其他地方建议Ray.intersectObjects() requires face centroids. 但是我不确定这一点，因为源代码没有引用质心。

也许原始几何中的法线不正确。先试试这个功能：

geometry.computeFaceNormals();

【讨论】：