2011-01-20 55 views
21

Come si convertono i valori di byte intero di rosso, verde e blu in una stringa esadecimale, che può quindi essere assegnata a un contesto per il rendering su un'area di disegno HTML5?Conversione di numeri interi in stringa esadecimale in JavaScript

Per esempio, convertire ciano,

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

Per una stringa esadecimale per l'assegnazione di un colore di riempimento contesto.

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

Oppure c'è un modo migliore per farlo del tutto?

risposta

16

Basta usare i valori RGB, come:

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

Le risposte migliori sono sempre le più semplici! –

+0

Ma grazie a tutti quelli che hanno risposto, sono state risposte interessanti e preziose per la mia conoscenza e comprensione. +1 ciascuno. –

+0

È compatibile con questo browser? –

0

È possibile scrivere un proprio metodo per questa conversione -

// 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); 
} 

fonte originale - http://programming.top54u.com/post/Javascript-Convert-Decimal-to-Hex.aspx

+0

Questo convertirà solo un nibble. –

+0

@El Ronnoco - Si prega di controllare il link. Eseguiamo un ciclo per chiamare questa funzione quando il numero decimale è maggiore di 15. –

+0

-1 Non c'è bisogno di riscrivere toString – 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

per convertire un da numero a esadecimale, è possibile utilizzare la funzione built-in toString (16). codice semplice:

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

credo, il modo più semplice è:

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

Utilizzare la funzione che dà la lingua.

+7

In questa risposta manca lo 0-padding necessario per i valori esadecimali dei colori. – Phrogz

+2

'0x' + g.toString (16), aggiungere un prefisso è piuttosto semplice – raykin

1

Per convertire i singoli valori RGB in un colore esadecimale, è possibile utilizzare questa funzione, anche se ha più senso utilizzare solo "rgb("+r+","+g+","+b+")".

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

~ fyi Ho incorporato la tua modifica alla mia risposta, nonostante sia stata respinta. http://stackoverflow.com/questions/17945972/converting-rgba-values-into-one-integer-in-javascript/17946089#17946089 (nessun buon modo per inviare messaggi qui) – MightyPork

+0

@ MightyPork oh, va bene, grazie per avermelo me. Sì, dovrebbe esserci un modo per le persone in arrivo qui. Oh bene. – kamoroso94

Problemi correlati