如何将纹理文件一一加载到 mtl 加载器

Question

我正在努力实现一个网站，让用户云上传他们的3D模型。他们看到了。当我上传obj-mtl纹理时，强制我使用blob url。我有一个再见的所有纹理 blob 网址，但我没有父网址。我想将纹理加载到 mtl 加载器，如何在没有 setTexturePath(( func 的情况下做到这一点。

我正在尝试将 obj 模型从三个.js导出到 gltf。

mtlLoader.setTexturePath(URL.createObjectURL(textureFolder));
    mtlLoader.load(URL.createObjectURL(mtlFile), (materials) => {
      materials.preload();
      objLoader.setMaterials(materials);
      objLoader.load(URL.createObjectURL(objFile),
        // called when resource is loaded
        (object) => {
          scene.add(object);
          exporter.parse(scene, (gltf) => {
            console.log(gltf);
            gltfFile = gltf2file(gltf, file.name);
            resolve(gltfFile);
          });
        },
        // called when loading is in progresses
        (xhr) => {
          console.log(`${(xhr.loaded / xhr.total) * 100}% loaded`);
        },
        // called when loading has errors
        (error) => {
          console.log(error);
          reject(new Error('Error occurred when converting file to gltf'));
        });
    },
    // called when loading is in progresses
    (xhr) => {
      console.log(`${(xhr.loaded / xhr.total) * 100}% loaded`);
    },
    // called when loading has errors
    (error) => {
      console.log('mtl error');
      console.log(error);
      reject(new Error('Error occurred when converting file to gltf'));
    });
  });

有没有人可以告诉我如何在不使用 setTexturePath(( 的情况下再见加载纹理

感谢赞美

Answer 1

我解决了为 MTLLoader 设置自定义加载管理器的问题

此处的示例代码

const loadingManagerMTL = new THREE.LoadingManager();
  loadingManagerMTL.setURLModifier((url) => {
    let newUrl;
    for (let i = 0; i < textureFolder.files.length; i++) {
      if (url === textureFolder.files[i].name) {
        newUrl = URL.createObjectURL(textureFolder.files[i]);
      }
    }
    return newUrl;
  });
  const mtlLoader = new MTLLoader(loadingManagerMTL);

现在，您可以根据需要自定义加载管理器...

您可以将加载管理器用于其他加载器以喜欢 OBJLoader