我的 glb 模型 Three.js 上的纹理映射问题

Question

我是这个领域的新手。 我上传我的模型并尝试向其中添加我需要的纹理。 `consttextureloader = new THREE.TextureLoader();

    const material = new THREE.MeshStandardMaterial({
      map: textureloader.load('./assets/textures/albedo/albedo-wood.png'),
    });

    var mat;

    loader.load(modelPath, (glb) => {
          
      const mesh = glb.scene;

      glb.scene.traverse( function( object ) {  
        if ((object instanceof THREE.Mesh))
          { 
            if (object.material) {
              mat = object.material;

              object.map = material.map;
              object.map.needsUpdate = true;
            }
          } 
      });

      this.scene.add(glb.scene);

` 但由于某种原因，纹理显示不正确。我唯一认为问题可能出在紫外线扫描上，但我对这个主题很陌生，所以我什至不确定它是什么。

我还注意到纹理在我的对象内正确显示。

模型本身是正确的，纹理也是正确的。我分别检查了不同的网站 模型本身是一个圆角立方体

Answer 1

• UV 映射（3D 模型的平面表示）不正确。
• 要在渲染中检查它，您可以使用 UV 检查器，它是带有可识别符号的纹理（您可以从 uvchecker.vinzi 生成它）。
• 这里最简单的方法是从建模软件（如 Blender）编辑模型的 UV，并检查如何正确“展开 UV”。对于立方体有两种方法，每个面都有相同的 UV 或者你有 “冒险”展开。