Question

如何将RGB颜色值转换为纯十进制？

所以我有：RGB（255,255,255）是白色的其十进制等值为：16777215

我试过想它可能只是：

var dec = r*g*b; // but this doesn't work

虽然这不起作用。

任何人都知道要从RGB（或rgba）转换为十进制的算法/等式吗？

Answer 1

RGB整数通常被视为三个不同的字节，其中最左侧（最高位）字节为红色，中间字节为绿色，最右侧（最低位）字节为蓝色。您可以像这样检索这些单独字节的值：

var c = 0xff03c0; // 16712640
var components = {
    r: (c & 0xff0000) >> 16, 
    g: (c & 0x00ff00) >> 8, 
    b: (c & 0x0000ff)
};

您可以通过将字节移回来重新创建其组件的颜色：

c = (components.r << 16) + (components.g << 8) + (components.b);

在您的情况下，只需将components.r（等）替换为您的实际变量。

Answer 2

更好的答案（就清晰度而言）是：

'Convert RGB to LONG:
 LONG = B * 65536 + G * 256 + R

'Convert LONG to RGB:
 B = LONG \ 65536
 G = (LONG - B * 65536) \ 256
 R = LONG - B * 65536 - G * 256

LONG是您要制作的长整数（十进制）。好吧？当然，bitshift

Answer 3

var dec = (b & 0xff) << 16 + (g & 0xff) << 8 + (r & 0xff);

（我认为这是r，g，b值的正确顺序）

<强>更新

我刚刚检查了浏览器应用程序，但订单错误，所以浏览器的正确公式（阅读HTML + CSS + javascript）是：

var dec = r << 16 + g << 16 + b;

假设r，g，b值<= 255

其他API可能期望r，g，b值的顺序不同。我似乎记得至少有一个顺序颠倒了（根据我原来的答案），但我想现在是哪一个。

Answer 4

if (color.substr(0, 1) === '#') {
    return color;
}
var digits = /(.*?)rgb\((\d+), (\d+), (\d+)\)/.exec(color);
var red = parseInt(digits[2]);
var green = parseInt(digits[3]);
var blue = parseInt(digits[4]);
var rgb = blue | (green << 8) | (red << 16);
return rgb.toString(10);

Answer 5

你需要将R左移16，将G左移8，或者将两者左移到B中。将值视为位，所有都将变为清晰：

R 255 = 11111111B G 255 = 11111111B B 255 = 11111111B

Shift R 16：111111110000000000000000 轮班G 8：000000001111111100000000

或进入B：111111111111111111111111

转换为十进制：16777215

Answer 6

我同意位移位更清晰，而且性能可能更好。

也就是说，如果由于语言支持（例如在电子表格中执行此操作）而需要数学答案，则模数％和trunc（）或floor（）使其简单：

假设红色，绿色和蓝色为8位，当然是（0-255）：

var rgbTotal = red * 65536 + green * 256 + blue;

var R = Math.trunc( rgbTotal / 65536 );
var G = Math.trunc( ( rgbTotal % 65536 ) / 256 );
var B = rgbTotal % 256;

讨论： 指向sam的答案，RGB值在顺序上几乎总是大端，当然在网页，jpeg和png上也是如此。我个人认为最好将红色乘以65536而不是蓝色，除非您正在使用一个需要它的库。

要返回单独的值：

对于R，只需除以65536，然后截断其余部分即可。
对于G，我们通过模数65536丢弃R，然后除以256，将余数舍去（余数为蓝色）。
对于B，我们采用mod 256，它处理了两个高字节。

对于 R＆G ，该数字需要截断以舍弃特定于语言的其余部分，主要是我们需要整数。在JavaScript中，Math.trunc（）是简单的方法，Math.floor（）也可以。 B 不需要，因为它是模数的余数-但这还假设我们不需要进行错误检查（例如来自用户输入的错误检查），即B的值始终为整数0- 255。

将RGB颜色值转换为Decimal

6 个答案: