在 three.js 中更改对象模型 material

Question

我有一个在 Blender 中创建的带有 UV 贴图的 3D 模型。我以纹理仅应用于模型一侧的方式应用 UV 贴图。我将模型导出为 obj 和 mtl。当我在 three.js 上导入此模型时，它按预期工作并且加载程序自动应用 mtl 文件中定义的图像作为纹理。

现在我想在 three.js 中以编程方式更改此纹理。该模型有多个material（我认为是因为有多个面孔）。我如何重新应用 material 维护 UV 贴图并仅更改应用的纹理？我想对模型应用 map 和 envMap。

                       var m = new THREE.MeshPhongMaterial({
                            envMap: cubemap,
                            reflectivity: 0.9
                        });
                        var m2 = new THREE.MeshPhongMaterial({
                            envMap: cubemap,
                            color: parseInt(material.color, 16),
                            reflectivity: 0.9,
                            map: THREE.ImageUtils.loadTexture('/textures/uv_checker large.png')
                        });

                        loadedMesh.material = [m,m,m,m,m,m2,m2,m2,m];

m 和 m2 位置经过反复试验后应用。纹理已应用，但最终看起来与原始纹理不同。由于我的 UV 映射，我在不应该有纹理的地方有一些小的空白空间甚至纹理。

我该如何处理？

Answer 1

好的，我找到了方法。我不知道这是否适用于所有模型，但我用我的自定义 material 替换了所有具有 map 纹理的 material 和另一个纹理，并替换了所有其他 materials 与另一个不同的 material。它运行完美，UV 贴图仍然存在。

var m1 = new THREE.MeshPhongMaterial({map: texture, ...});
var m2 = new THREE.MeshPhongMaterial({...});
for(var n = 0; n < model.material.length; ++n) {
   if(model.material[n].map) model.material[n] = m1;
   else model.material[n] = m2;
}

在 three.js 中更改对象模型 material

Change obj model material in three.js

javascript

three.js

texture-mapping

uv-mapping