javascript - 如果我没有 .mtl，是否可以加载带有颜色的 .obj 文件？

Question

我是 three.js 的新手，我遇到了这个问题。我对我的脸进行了 3D 扫描，结果只给我 .obj 文件。如果我在 Meshlab 模型上打开该文件，它就会带有颜色。但在我将它加载到 three.js 上后，它没有纹理。

            
    
            // Loader 
            
            const loader = new OBJLoader();

            loader.load( './models/scene.obj', 
            function ( OBJ ) {
            
            var boundingBox = new THREE.Box3().setFromObject( OBJ );
            boundingBox.getCenter( OBJ.position ).negate();
            
                scene.add( OBJ );
                
            },
            
            

            function ( xhr ) {

                console.log( ( xhr.loaded / xhr.total * 100 ) + '% loaded' );

            },
            

    function ( error ) {

        console.log( 'An error happened' );

    }
);

It's how my 3D model looks on three.js

也是一面倒的一面

也尝试过此解决方案，但它不起作用。出现“发生错误”而没有任何解释

objLoader.load('assets/faceimage9.obj', function(object) {
  scene.add(object);
  object.traverse(node => {
    if (node.material) {
      node.material.vertexColors = true;
    }
  });
});

感谢您的回答!

编辑:我的 .obj 最初看起来像 ~50000 行 然后像这样

这是完整的 .obj https://drive.google.com/drive/folders/1x9MaZVWHTa-wSDkv8xzdRKU-ASPuJLOw?usp=sharing

Answer 1

OBJ 资源定义了 [0,255] 范围内的顶点颜色，THREE.OBJLoader 不支持。颜色数据必须在规范化的 [0,1] 范围内定义。不幸的是，OBJ 规范并未提及顶点颜色，因此应用程序无法始终如一地导出此类数据。

在 three.js 中改进 Assets 渲染的一个简单修复是:

objLoader.load('assets/faceimage9.obj', function(object) {
  scene.add(object);
  object.traverse(node => {
    if (node.material) {
      node.material.side = THREE.BackSide;
    }
  });
});

这样，面应该正确显示(但没有顶点颜色)。