JavaScript將RGB整數轉換爲十六進制

Question

我正在使用Vivagraph JS庫來渲染一些圖。

我想改變該節點的顏色這樣

nodeUI.color = 0xFFA500FF;

^這是一個隨機例子。不低於

爲RGB相應的十六進制值，我從服務器RGB值獲得儘可能這樣

rgb = [229,64,51]

數組如何轉換RGB上述文件檔案化管理的十六進制類型值？

由於

Answer 1

根據這裏在代碼中的註釋：https://github.com/anvaka/VivaGraphJS/blob/master/demos/other/webglCustomNode.html

值0xFFA500FF是一個32位值，該值包括Alpha通道，所以忽略alpha通道它相當於RGB（255,165,0） 。

一些從32位十六進制轉換爲24位rgb和後面的函數如下，這些註釋足以解釋它們是如何工作的。

/* @param {number} v - value to convert to RGB values 
 
** @returns {Array} - three values for equivalent RGB triplet 
 
**      alpha channel is ingored 
 
** 
 
** e.g. from32toRGB(0xaec7e8) // 255,165,0 
 
*/ 
 
function from32toRGB(v) { 
 
    var rgb = ('0000000' + v.toString(16)) // Convert to hex string with leading zeros 
 
      .slice(-8)  // Get last 8 characters 
 
      .match(/../g) // Split into array of character pairs 
 
      .splice(0,3) // Get first three pairs only 
 
      .map(function(v) {return parseInt(v,16)}); // Convert each value to decimal 
 
    return rgb; 
 
} 
 

 
/* @param {Array} rgbArr - array of RGB values 
 
** @returns {string}  - Hex value for equivalent 32 bit color 
 
**       Alpha is always 1 (FF) 
 
** 
 
** e.g. fromRGBto32([255,165,0]) // aec7e8FF 
 
** 
 
** Each value is converted to a 2 digit hex string and concatenated 
 
** to the previous value, with ff (alpha) appended to the end 
 
*/ 
 
function fromRGBto32(rgbArr) { 
 
    return rgbArr.reduce(function(s, v) { 
 
    return s + ('0' + v.toString(16)).slice(-2); 
 
    },'') + 'ff' 
 
} 
 

 
// Tests for from32toRGB 
 
    [0xFFA500FF, 0xaec7e8ff,0,0xffffffff].forEach(function(v) { 
 
    document.write(v.toString(16) + ' : ' + from32toRGB(v) + '<br>') 
 
    }); 
 

 
document.write('<br>'); 
 

 
// Tests for fromRGBto32 
 
    [[255,165,0],[174,199,232], [0,0,0], [255,255,255]].forEach(function(rgbArr) { 
 
    document.write(rgbArr + ' : ' + fromRGBto32(rgbArr) + '<br>'); 
 
    });

注意，在分配：

odeUI.color = 0xFFA500FF 

十六進制值0xFFA500FF被立即轉換成十進制11454440.向fromRGBto32將結果轉換爲一個數字，可以被分配到odeUI.color，使用parseInt：

parseInt(fromRGBto32([229,64,51]), 16); 

或者如果您想要對其進行硬編碼，只需在前面添加'0x'即可。

如果你有一個像「RGB（229,64,51）」，你可以通過獲取的數字，轉換爲十六進制字符串和連接將其轉換爲十六進制值的字符串：

var s = 'rgb = [229,64,51]'; 
 
var hex = s.match(/\d+/g); 
 

 
if (hex) { 
 
    hex = hex.reduce(function(acc, value) { 
 
    return acc + ('0' + (+value).toString(16)).slice(-2); 
 
    }, '#') 
 
} 
 

 
document.write(hex + '<br>'); 
 

 
// Append FF to make 32 bit and convert to decimal 
 
// equivalent to 0xe54033ff 
 
document.write(parseInt(hex.slice(-6) + 'ff', 16)); // 0xe54033ff -> 3846190079