Three.js 法线不正确

Question

我必须编写脚本才能在网格上显示法线。在最小的脚本上，一切正常。如果我在我现有的应用程序之一中使用相同的模型，那么一切都是错误的。在镜头前，正常检测似乎是正确的，但我一旋转网格，正常检测就不好了。在这两个脚本中，我都使用 raycaster 来获取交点，我使用：

                var p = intersects[ 0 ].point;
                intersection.point.copy( p );
                var n = intersects[ 0 ].face.normal.clone();
                n.multiplyScalar( 100 );
                n.add( intersects[ 0 ].point );
                intersection.normal.copy( intersects[ 0 ].face.normal );

                line.geometry.vertices[ 0 ].copy( intersection.point );
                line.geometry.vertices[ 1 ].copy( n );
                line.geometry.verticesNeedUpdate = true;

获得正常。

什么会导致这种差异，因为我在两个脚本中对法线使用相同的网格和相同的命令来获取法线？

Answer 1

我找到了问题的根源：

在工作脚本中，我使用 Orbitcontrols 来变换网格；
在非工作脚本中，我正在自己转换网格，似乎法线没有更新。发生的事情是原点是正确的，但法线方向与网格进行任何变换之前的方向相同。变换未应用于法线。我没有进一步挖掘并切换到 OrbitControls。

Three.js 法线不正确

Three.js normals not correct

intersection

normals

three.js