LostTechnology Blog

気になる製品やニュースと株式投資などをなんとなく書き綴ります。でも戯言や写真が多くなりそう。旅行先を検討中の方は写真が参考になれば幸いです。なお、当然ながら文章および写真の無断転載はお断りしています。使いたい場合には事前にContactからご相談ください。掲載している写真はサーバーのファイル容量節約のために長辺1920pixel以下に抑えています。

色の変換を書いてみた

[記事公開日]time 2012/02/10

この先に使う予定なので、CMYKからRGBへの変換、RGBからCMYKへの変換、RGBからHSLへの変換をJavaScriptで書いてみた。

とりあえず書いてみただけなのでバグがあるかもしれない。

RGBとCMYKの変換は不可逆だし、同じ色にはならないんだよねぇ。

function jsByte2Hex(n) {
var r=n.toString(16);
return (r.length>1)?r:'0'+r;
}
function jsHex2Byte(h,p) {
return parseInt(h.substr(p,2),16);
}
function jsCMYK2RGB(c,m,y,k) {
var r,g,b;
c=c/100;
m=m/100;
y=y/100;
k=k/100;
r=Math.round((1-Math.min(1,c*(1-k)+k))*255);
g=Math.round((1-Math.min(1,m*(1-k)+k))*255);
b=Math.round((1-Math.min(1,y*(1-k)+k))*255);
return '#'+jsByte2Hex(r)+jsByte2Hex(g)+jsByte2Hex(b);
}
function jsRGB2CMYK(r,g,b) {
var c,m,y,k;
k=Math.min(1-r/255,Math.min(1-g/255,1-b/255));
c=Math.round(((1-(r/255)-k)/(1-k))*100);
m=Math.round(((1-(g/255)-k)/(1-k))*100);
y=Math.round(((1-(b/255)-k)/(1-k))*100);
k=Math.round(k*100);
return [c,m,y,k];
}
function jsRGB2HSL(r,g,b) {
var h,s,l;
var RGBmax=Math.max(r,g,b),RGBmin=Math.min(r,g,b);
if (RGBmax==r) {
h=((g-b)/(RGBmax-RGBmin))*60;
} else if (RGBmax==g) {
h=((b-r)/(RGBmax-RGBmin))*60+120;
} else {
h=((r-g)/(RGBmax-RGBmin))*60+240;
}
l=(RGBmax/255+RGBmin/255)/2;
if (l<=0.5) {
s=(RGBmax-RGBmin)/(RGBmax+RGBmin);
} else {
s=(RGBmax-RGBmin)/(2*255-RGBmax-RGBmin);
}
return [h,s,l];
}

一応、これを使っていってみるとしよう。

sponsored link

down

コメントする






sponsored link

カテゴリー