Chuyển đổi số nguyên thành chuỗi thập lục phân trong JavaScript

Question

Làm cách nào để chuyển đổi các giá trị byte nguyên của màu đỏ, xanh lá cây và xanh lam thành chuỗi hex, sau đó có thể gán cho một ngữ cảnh để hiển thị trên canvas HTML5?

Ví dụ, chuyển đổi màu lục lam,

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

Để một chuỗi hex cho gán đến một màu sắc bối cảnh điền.

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

Hoặc có cách nào tốt hơn để làm điều này hoàn toàn không?

Answer 1

Chỉ cần sử dụng các giá trị RGB, như:

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

Answer 2

Bạn có thể viết phương pháp riêng của bạn cho chuyển đổi này -

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

gốc nguồn - http://programming.top54u.com/post/Javascript-Convert-Decimal-to-Hex.aspx

Answer 3

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

Answer 4

Để chuyển đổi một số thành hex, bạn có thể sử dụng hàm toString (16) tích hợp sẵn. mã đơn giản:

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

Answer 5

Tôi nghĩ, cách đơn giản nhất là:

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

Sử dụng tính năng cung cấp cho ngôn ngữ.

Answer 6

Để chuyển đổi giá trị RGB riêng lẻ thành màu hex, bạn có thể sử dụng chức năng này, mặc dù việc sử dụng "rgb("+r+","+g+","+b+")" thay vào đó sẽ có ý nghĩa hơn.

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