THREE.js OBJLoader - 加载到几何体，操作，然后保存到BufferGeometry

Question

我正在尝试确定为什么我不能平滑用OBJLoader加载的阴影几何体。

var loader = new THREE.OBJLoader(manager);
loader.load('/manmodel/js/man.obj', function (object, materials) {
    console.log(object);
    console.log(materials);
    man = object;
    man.traverse(function (child) {
        if (child instanceof THREE.Mesh) {
            child.geometry.computeFaceNormals();
            child.geometry.computeVertexNormals( true );
            child.material = new THREE.MeshPhongMaterial({
                color: 'white',
                shading: THREE.SmoothShading // <-----------  THIS IS THE PROBLEM
            });
        }
    });
    man.position.y = -10;
    scene.add(man);
});

结果如下：

如果我删除了computeFaceNormals（）行，模型会呈现相同的效果。 如果我删除computeVertexNormals（true），对象渲染时没有光照（黑色） - 所以我知道这是做某事。

如果我在此代码中更改了MeshPhongMaterial的颜色属性，颜色会发生变化，所以我也知道这是有效的。

我曾尝试使用顶点和普通助手来确定问题所在，但它们失败了，因为使用BufferGeometry时，面和顶点不会存储为数组。

我也尝试修改man.obj文件以更改＆＃39; s＆＃39;来自＆＃39; off＆＃39;的值这没什么。

因为我将为Blender中生成的不同人物加载几个.obj文件，目前每个大约2MB，我更喜欢在浏览器上进行着色而不是“烘焙”。如果这会增加文件大小，它会进入文件。

问题：我在这里遗漏了什么吗？要么， 有没有办法将.obj文件作为标准几何体加载，计算法线，应用着色，然后另存为BufferGeometry？

PS。我可能还需要在线下进行光线追踪的法线。

Answer 1

最新版本的ObjLoader出于性能原因将.obj解析为BufferGeometry。如果您回顾一下GitHub上的历史记录，您可以找到解析为Geometry的先前版本：

https://github.com/mrdoob/three.js/blob/a321ba05f02ae3a1586a4060a53f5ad63b90729b/examples/js/loaders/OBJLoader.js

使用此加载.obj，然后您可以根据需要操作几何体直到获得它，然后创建一个新的BufferGeometry并使用BufferGeometry.fromGeometry（geometry）将Geometry加载到其中以获得性能。我的工作很好。

Answer 2

如果我们想要使用最新的加载器（r73），我们也可以将BufferGeometry转换为Geometry，然后再转换回来！

唯一需要注意的是，在计算顶点法线之前，我必须合并顶点。我猜测从缓冲区转换是否与三角形混淆，所以我们必须在它们之前合并它们。

 var geometry = new THREE.Geometry().fromBufferGeometry( child.geometry );
 geometry.computeFaceNormals();
 geometry.mergeVertices();
 geometry.computeVertexNormals();
 child.geometry = new THREE.BufferGeometry().fromGeometry( geometry );