HSVから16進数RGBへ変換
HSVから16進数RGBへ変換するには次のような方法で可能です。
- ※ HSLはHue(色相)、Saturation(彩度)、Value(明度)のそれぞれの頭文字を取った名称です。
functionの定義
JavaScript
var hsvToRgb16 = function(hue, saturation, value) {
var result = false;
if (((hue || hue === 0) && hue <= 360) && ((saturation || saturation === 0) && saturation <= 100) && ((value || value === 0) && value <= 100)) {
var red = 0,
green = 0,
blue = 0,
i = 0,
f = 0,
q = 0,
p = 0,
t = 0;
hue = Number(hue) / 60;
saturation = Number(saturation) / 100;
value = Number(value) / 100;
if (saturation === 0) {
red = value;
green = value;
blue = value;
} else {
i = Math.floor(hue);
f = hue - i;
p = value * (1 - saturation);
q = value * (1 - saturation * f);
t = value * (1 - saturation * (1 - f));
switch (i) {
case 0 :
red = value;
green = t;
blue = p;
break;
case 1 :
red = q;
green = value;
blue = p;
break;
case 2 :
red = p;
green = value;
blue = t;
break;
case 3 :
red = p;
green = q;
blue = value;
break;
case 4 :
red = t;
green = p;
blue = value;
break;
case 5 :
red = value;
green = p;
blue = q;
break;
}
}
result = {
red : Math.round(red * 255).toString(16),
green : Math.round(green * 255).toString(16),
blue : Math.round(blue * 255).toString(16)
};
}
return result;
};
使い方
引数名 | 型 | 説明 | |
---|---|---|---|
第一引数 必須 |
hue | number | 色合い(hue) |
第二引数 必須 |
saturation | number | 彩度(saturation) |
第三引数 必須 |
value | number | 明度(value) |
戻り値
16進数のRGBに変換された文字列がハッシュとして返ります。
サンプルコード
JavaScript
var result = hsvToRgb16(205, 52, 100);
alert(result.red);