如何使用Three.js修改3D模型网格的颜色？

• 首先修正代码参数错误：setRGB() 方法接收的是0到1之间的浮点数，不是字符串格式的0-255数值。你的代码里传了字符串"255"，这会导致颜色计算异常。正确写法：

  // 红色（对应RGB 255,0,0）
  root.getObjectByName(model).material.color.setRGB(1, 0, 0);
  // 绿色（对应十六进制0x00ff00）
  root.getObjectByName(model).material.color.setHex(0x00ff00);
  

• 颜色与默认/纹理混合的问题，通常是这两个原因：

  1. 材质存在纹理（map）：Three.js中带纹理的材质，color属性会和纹理颜色做乘法混合。如果要纯色完全覆盖，需要先移除纹理：

     const material = root.getObjectByName(model).material;
     material.map = null; // 移除纹理
     material.color.setHex(0x00ff00);
     material.needsUpdate = true; // 通知Three.js更新材质
     

  2. 材质颜色空间设置不对：如果使用的是现代材质（如MeshStandardMaterial），确保颜色空间配置正确，避免颜色偏差：

     const material = root.getObjectByName(model).material;
     material.colorSpace = THREE.SRGBColorSpace;
     material.color.setHex(0x00ff00);
     material.needsUpdate = true;
     

• 最后务必添加material.needsUpdate = true，修改材质属性后需要手动触发更新，否则渲染器不会应用新的颜色设置。

内容的提问来源于stack exchange，提问作者Rajesh Pathak