| サンプル |
<![CDATA[
<html>
<head>
<title>HSLカラーバーを描く</title>
</head>
<body>
<table border="0" cellspacing="0" cellpadding="0">
<script language="JavaScript"><!--
r = g = b = 0;
function HSLtoRGB(h,s,l)
{
r = g = b = 0;
if (s < 0) s = 0;
if (s > 1) s = 1;
if (l < 0) l = 0;
if (l > 1) l = 1;
h = h % 360;
if (h < 0) h = h + 360;
if (l <= 0.5)
{
cmin = l * ( 1 - s );
cmax = 2 * l - cmin;
}else{
cmax = l * ( 1 - s ) + s;
cmin = 2 * l - cmax;
}
r = h2v(h+120,cmin,cmax);
g = h2v(h,cmin,cmax);
b = h2v(h-120,cmin,cmax);
}
function h2v(hh,min,max)
{
hh = hh % 360;
if (hh < 0) hh = hh + 360;
if (hh < 60) return min + (max - min) * hh / 60;
if (hh >= 60 && hh < 180) return max;
if (hh >=180 && hh < 240) return min+(max-min)*(240-hh)/60;
return min;
}
for (H=0; H<360 ; H+=10)
{
document.write("<tr>");
for (L = 0; L<1; L+= 0.05)
{
HSLtoRGB(H,1,L);
r = Math.floor(r * 255).toString(16);
g = Math.floor(g * 255).toString(16);
b = Math.floor(b * 255).toString(16);
if (r.length < 2) r = "0" + r;
if (g.length < 2) g = "0" + g;
if (b.length < 2) b = "0" + b;
c = "#"+r+g+b;
document.write("<td bgcolor='"+c+"'><img src='chip.gif' width='4' height='4'></td>");
}
document.write("</tr>");
}
// --></script>
</table>
</body>
</html>
]]>
|
HSLカラーバーを描く