10進数RGBからHSVへ変換
10進数RGBからHSVへ変換するには次のような方法で可能です。
- ※ HSLはHue(色相)、Saturation(彩度)、Value(明度)のそれぞれの頭文字を取った名称です。
functionの定義
JavaScript
var rgb10ToHsv = function(red, green, blue) {
var result = false;
if (((red || red === 0) && red <= 255) && ((green || green === 0) && green <= 255) && ((blue || blue === 0) && blue <= 255)) {
var hue = 0,
saturation = 0,
value = 0,
red2 = 0,
green2 = 0,
blue2 = 0,
diff = 0;
red = Number(red) / 255;
green = Number(green) / 255;
blue = Number(blue) / 255;
value = Math.max(red, green, blue);
diff = value - Math.min(red, green, blue);
var diffColor = function(color) {
return (value - color) / 6 / diff + 1 / 2;
};
if (diff !== 0) {
saturation = diff / value;
red2 = diffColor(red);
green2 = diffColor(green);
blue2 = diffColor(blue);
if (red === value) {
hue = blue2 - green2;
} else if (green === value) {
hue = (1 / 3) + red2 - blue2;
} else if (blue === value) {
hue = (2 / 3) + green2 - red2;
}
if (hue < 0) {
hue += 1;
} else if (hue > 1) {
hue -= 1;
}
}
result = {
hue : Math.round(hue * 360),
saturation : Math.round(saturation * 100),
value : Math.round(value * 100)
};
}
return result;
};
使い方
引数名 | 型 | 説明 | |
---|---|---|---|
第一引数 必須 |
red | number | 10進数の赤 |
第二引数 必須 |
green | number | 10進数の緑 |
第三引数 必須 |
blue | number | 10進数の青 |
戻り値
HSVに変換された文字列がハッシュとして返ります。
サンプルコード
JavaScript
var result = rgb10ToHsv(123, 200, 255);
alert(result.hue);