三.js如何在mtl，obj文件上映射纹理答案

【问题标题】：three.js how to map a texture on mtl,obj file三.js如何在mtl，obj文件上映射纹理
【发布时间】：2017-01-24 16:18:21
【问题描述】：

我正在尝试在 mtl、obj 文件上映射 png 文件

制图前

但是映射后，mtl 纹理就消失了。

映射后

我该怎么办？我不擅长英语。如果您不能理解我的问题，请发表评论。

这是我的代码：

           var onProgress = function(xhr) {
           var percentComplete = xhr.loaded / xhr.total * 100;
           console.log(Math.round(percentComplete, 2) + '% downloaded');
        };


        var onError = function(xhr) {};

        THREE.Loader.Handlers.add(/\.dds$/i, new THREE.DDSLoader());

        var loader = new THREE.ImageLoader();
        loader.load("../img/ang.png", function(image) {

           texture.minFilter = THREE.LinearFilter;   
           texture.image = image;
           texture.wrapS = THREE.ClampToEdgeWrapping;
           texture.wrapT = THREE.ClampToEdgeWrapping;
           texture.offset.set(-3, -9.5);
           texture.repeat.set(13, 13);
           texture.needsUpdate = true;

        },onProgress,onError);

        var mtlLoader = new THREE.MTLLoader();
        mtlLoader.setPath('../models/');
        mtlLoader.load('nag-green.mtl', function(materials) {

           materials.preload();

           var objLoader = new THREE.OBJLoader();
           objLoader.setMaterials(materials);
           objLoader.setPath('../models/');
           objLoader.load('nag-green.obj', function(object) {

              object.traverse(function(child) {

                 if (child instanceof THREE.Mesh) {
                    child.material.map = texture;
                 }
              });

              object.name = "object";
              object.position.y = 0;
              scene.add(object);

           }, onProgress, onError);
        });

我想要做的是将“ang.png”文件映射到这样的 T 恤上

what i want

谢谢你的回答 Radio，我试过那样做，但这不是我想做的。

give a name to material and map

【问题讨论】：

标签： javascript three.js mapping

【解决方案1】：

您已将相同的“ang.png”纹理应用于所有子网格。我认为您需要在 traverse 函数中使用条件来将纹理仅应用于需要纹理的网格部分。

mtl 应该在首次加载材质时为其应用名称。例如，这里我假设材质名称是“torso”。您的原始 3d 编辑器的导出器将为它指定其他名称。无论如何，您应该能够在条件中查询名称：

          object.traverse(function(child) {
             if (child instanceof THREE.Mesh) {         
                 if(child.material != undefined){
                    if(child.material.name=="torso"){
                      child.material.map = texture;
                    }
                 }
             }
          });

【讨论】：