Three.js技术需求：实现十进制RGB转十六进制RGB的JavaScript函数

我刚好在Three.js项目里处理过一模一样的颜色转换需求，给你两个实用的JavaScript函数，分别对应你要的两种格式：

1. 转换为#RRGGBB字符串格式 #

这个函数会把十进制RGB值拆分为红、绿、蓝三个通道，每个通道转成两位十六进制字符串（不足两位补0），最后拼接成标准的十六进制颜色字符串：

function decimalToHexColor(decimal) {
  // 拆分RGB通道
  const r = (decimal >> 16) & 0xFF;
  const g = (decimal >> 8) & 0xFF;
  const b = decimal & 0xFF;
  
  // 转成两位十六进制并补零，再拼接
  return `#${((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1)}`;
}

// 示例使用
console.log(decimalToHexColor(12615680)); // 输出 "#c06000"
console.log(decimalToHexColor(16711680)); // 输出 "#ff0000"

2. 转换为0xRRGGBB数值格式 #

如果你是要给Three.js的材质颜色赋值（比如mesh.material.color.set(0xFF0000)），其实十进制数值本身和0x开头的十六进制数值是等价的——因为JavaScript里数值不区分进制。但如果需要得到字符串形式的0xRRGGBB，或者确保输出是标准的十六进制数值表示，可以用这个函数：

function decimalTo0xHex(decimal) {
  // 直接转成十六进制字符串并加上0x前缀，需要大写的话可以用toUpperCase()
  return `0x${decimal.toString(16).padStart(6, '0')}`;
  
  // 如果需要返回数值类型，直接返回decimal即可，比如：
  // return decimal;
}

// 示例使用
console.log(decimalTo0xHex(12615680)); // 输出 "0xc06000"
console.log(decimalTo0xHex(16711680)); // 输出 "0xff0000"

额外提示：Three.js内置方法 #

其实Three.js的Color类本身就支持直接传入十进制RGB值，比如：

const color = new THREE.Color(12615680);
console.log(color.getHexString()); // 输出 "c06000"
console.log(color.getHex()); // 输出 12615680（和输入的十进制值一致）

如果只是在Three.js里使用颜色，直接用THREE.Color的实例会更方便，它内置了各种格式的转换方法。

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