Three.js中如何清除mesh材质color设置对纹理显示的影响？

问题根因 #

Three.js 所有内置带map纹理属性的材质（如MeshBasicMaterial、MeshStandardMaterial等），默认会将材质color属性与纹理的RGB值按通道相乘，得到最终渲染颜色。你提前设置了红色#ff0000，其G、B通道值均为0，无论替换什么纹理，G、B通道的纹理颜色都会被乘0消去，最终只会显示红色调。

解决方法 #

1. 重置材质颜色为白色（最常用） #

白色RGB值为(1,1,1)，和任意颜色相乘都不会改变原颜色值，可直接还原纹理本身的显示效果：

// 重置颜色为白色
mesh.material.color.set(0xffffff)
// 动态更换纹理后需要标记材质需要更新
mesh.material.needsUpdate = true

2. 克隆独立材质（共享材质场景用） #

如果当前材质是多个网格共享的，修改前先克隆一份独立材质，避免影响其他网格的显示：

mesh.material = mesh.material.clone()
mesh.material.color.set(0xffffff)
mesh.material.map = 你的新蓝色纹理
mesh.material.needsUpdate = true

注意事项 #

• 不要直接删除color属性，内置材质依赖该属性的默认值运行，删除会导致材质渲染报错
• 如果重置颜色后纹理仍然不生效，检查新纹理是否加载完成，needsUpdate属性是否正确设置

内容的提问来源于stack exchange，提问作者Алексей