2011-01-20 10 views
21

¿Cómo convierto valores de bytes enteros de rojo, verde y azul en una cadena hexadecimal, que luego se puede asignar a un contexto para su representación en un lienzo de HTML5?Conversión de enteros a cadena hexadecimal en JavaScript

Por ejemplo, convertir cian,

var r = 0; 
var g = 255; 
var b = 255; 

Para una cadena hexadecimal para asignar a un color de relleno contexto.

this.context.fillStyle = '#00FFFF'; 

¿O existe una mejor manera de hacerlo todo?

Respuesta

16

sólo tiene que utilizar los valores RGB, como:

this.context.fillStyle = "rgb(0,255,255)"; 
+0

¡Las mejores respuestas son siempre las más simples! –

+0

Pero gracias a todos los que respondieron, fueron respuestas interesantes y valiosas para mi conocimiento y comprensión. +1 cada uno. –

+0

¿Es compatible con varios navegadores? –

0

Usted puede escribir su propio método para esta conversión -

// function to generate the hex code 
function getHex(dec) 
{ 
    var hexArray = new Array("0", "1", "2", "3", 
           "4", "5", "6", "7", 
           "8", "9", "A", "B", 
           "C", "D", "E", "F"); 

    var code1 = Math.floor(dec/16); 
    var code2 = dec - code1 * 16; 

    var decToHex = hexArray[code2]; 

    return (decToHex); 
} 

fuente original - http://programming.top54u.com/post/Javascript-Convert-Decimal-to-Hex.aspx

+0

Esto solo convertirá un nibble. –

+0

@El Ronnoco - Por favor, consulte el enlace. Ejecutamos un bucle para llamar a esta función cuando el número decimal es mayor que 15. –

+0

-1 No es necesario volver a escribir en String – Tomas

1
function pad(number, length) { 
    var str = '' + number; 
    while (str.length < length) str = '0' + str; 
    return str; 
} 

function toRGBHex(r,g,b) { 
    return pad(r.toString(16),2) + pad(g.toString(16),2) + pad(b.toString(16),2); 
} 
24

Para convertir una número a hexadecimal, puede usar la función incorporada aString (16). código simple:

function convert(integer) { 
    var str = Number(integer).toString(16); 
    return str.length == 1 ? "0" + str : str; 
}; 

function to_rgb(r, g, b) { return "#" + convert(r) + convert(g) + convert(b); } 

var color = to_rgb(r, g, b); 
11

creo, la forma más sencilla es:

 
var g = 255; 
g.toString(16); //gives "ff" 

Use la función que da idioma.

+7

En esta respuesta falta el relleno de 0 necesario para los valores de color hexadecimales. – Phrogz

+2

'0x' + g.toString (16), agregue un prefijo es bastante simple – raykin

1

Para convertir sus valores RGB individuales en un color hexadecimal, puede usar esta función, aunque tiene más sentido simplemente usar "rgb("+r+","+g+","+b+")" en su lugar.

function rgbToHex(r,g,b) { 
    return "#"+("00000"+(r<<16|g<<8|b).toString(16)).slice(-6); 
} 
+0

~ fyi He incorporado su edición a mi respuesta, a pesar de haber sido rechazada. http://stackoverflow.com/questions/17945972/converting-rgba-values-into-one-integer-in-javascript/17946089#17946089 (no es una buena manera de enviar mensajes aquí) – MightyPork

+0

@MightyPork oh, está bien, gracias por contar yo. Sí, debería haber una forma de ingresar a la gente aquí. Oh bien. – kamoroso94

Cuestiones relacionadas