2011-12-12 72 views
8

¿Cómo convierto un valor de color RGB a simplemente decimal plano?Convierta un valor de color RGB en Decimal

por lo que tengo: RGB (255,255,255) es blanco
su equivalente decimal es: 16777215

He tratado de pensar que sólo podría ser:

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

Aunque eso no funciona.

¿Alguien sabe del algoritmo/ecuación para convertir de RGB (o rgba) a decimal?

+2

16,777,215 es el equivalente decimal de la versión hexadecimal, 0x00FFFFFF, de su RGB (255,255,255). –

+0

¿Qué piensas hacer con estos valores? ¿A qué software/funciones/etc. te los dan? –

+0

Tengo valores de color de una aplicación flash, que están en decimal y tengo que mostrarlos en html/css y también convertir de nuevo viceversa. –

Respuesta

10

Los números enteros RGB se tratan típicamente como tres bytes distintos, donde el byte más a la izquierda (orden superior) es rojo, el byte central es verde y el byte más cercano (más bajo) es azul . Puede recuperar los valores de estos bytes individuales como esto:

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

puede volver a crear un color de sus componentes al cambiar los bytes de vuelta en:

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

En su caso, basta con sustituir components.r (etc.) con sus variables reales.

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

(Creo que es el orden correcto de los R, G, los valores de b)

actualización

acabo de comprobar para aplicaciones de navegador y me dieron la orden equivocado, por lo que la correcta fórmula para navegadores (leer HTML + CSS + JavaScript) es:

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

Suponiendo r, g, b Los valores < = 255

Otras API pueden esperar un orden diferente para los valores de r, g, b. Me parece recordar al menos uno que tiene el orden invertido (según mi respuesta original), pero creo cuál es en este momento.

+0

Es posible que tenga razón sobre el pedido, en cuyo caso, mi respuesta es incorrecta :( –

+0

El orden correcto en términos de qué? Para quién? El orden depende de quién está * leyendo * el valor. –

+0

@Nicol - No, el el orden correcto depende de la API. No estoy seguro acerca de la API de Win32, pero para las aplicaciones basadas en navegador (que supongo que se tratarán aquí) estoy bastante seguro de que Blue es el byte de orden superior (de los tres) y El rojo es el byte de bajo orden. –

0

Necesitas izquierda desplazar el R por 16, el G dejado por 8 y o ambos en la B. Mira los valores como bits y todo se aclarará:

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

Shift R 16: 111111110000000000000000 Shift G 8: 000000001111111100000000

o en B: 111111111111111111111111

Conve rt a decimal: 16777215

1
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); 
+1

rgb.toString (10) es lo que necesitaba –

5

Una respuesta mucho mejor (en términos de claridad) es la siguiente:

'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 

tiempo es su entero largo (decimal) que desea realizar. Fácil ¿eh? Sure, bitshift

+1

Creo que el cambio de bit es mucho más claro. –

+0

@ DanielA.White tal vez no lo crea así, pero no puedo ver cómo otra respuesta a esta pregunta es la mitad de clara que esta. Incluso yo puedo entender esto. –

Cuestiones relacionadas