Three.js 计算顶点法线

Question

我正在试验其中一个示例，即 webgl_loader_obj.html 以将从 Blender 导出的 .obj 文件加载到three.js

这可以正常工作并完全按预期显示模型。
现在我正在研究 material.shading = THREE.SmoothShading 的使用。

为此，模型需要具有顶点法线。
从 blender 导出的文件没有定义法线。

所以我看着使用 computeVertexNormals 来计算所需的法线。
但是这似乎没有做任何事情，结果 View 是未平滑的模型。

除此之外，作为测试，我导出了相同的模型，带有法线。
直接加载它，它看起来很平滑。

如果我随后执行了 computeFaceNormals() 和 computeVertexNormals() 操作，则会再次导致网格不平滑。

var loader = new THREE.OBJLoader( manager );
            loader.load( 'test.obj', function ( object ) {

                object.traverse( function ( child ) {

                    if ( child instanceof THREE.Mesh ) {
                        child.material = new THREE.MeshLambertMaterial( { color: 0xff6600 });

                        child.geometry.computeFaceNormals();
                        child.geometry.computeVertexNormals();
                        child.material.shading = THREE.SmoothShading;


                    }

                } );

Answer 1

Geometry.computeVertexNormals()通过将每个顶点法线计算为共享该顶点的所有面的面法线的平均值来“平滑”顶点法线。

如果几何体的每个面都有唯一的顶点(即没有顶点与相邻面共享)，则 computeVertexNormals()将导致每个面的顶点法线与面法线相同，并且网格着色将显示为多面的。

三.js r.71