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

【问题标题】：THREE.js OBJLoader - load to Geometry, manipulate, then save to BufferGeometryTHREE.js OBJLoader - 加载到几何，操作，然后保存到 BufferGeometry
【发布时间】：2014-12-23 18:49:47
【问题描述】：

我正在尝试确定为什么我无法平滑使用 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 文件以将 's' 值从 'off' 更改为 1。这没有任何作用。

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

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

ps。我可能还需要法线来进一步进行光线追踪。

【问题讨论】：

标签： javascript three.js smoothing .obj

【解决方案1】：

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

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

使用这个加载你的.obj，然后你可以操作几何直到你需要它，然后创建一个新的 BufferGeometry 并使用 BufferGeometry.fromGeometry(geometry) 将几何加载到其中以获得性能。我有这个很好的工作。

【讨论】：

【解决方案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 );

【讨论】：