300分的问题同时给上一个在线配色程序!!

var colorWheel = new Array(12);
colorWheel['0']   = [255,0,0];
colorWheel['15']  = [255,51,0];
colorWheel['30']  = [255,102,0];
colorWheel['45']  = [255,128,0];
colorWheel['60']  = [255,153,0];
colorWheel['75']  = [255,178,0];
colorWheel['90']  = [255,204,0];
colorWheel['105'] = [255,229,0];
colorWheel['120'] = [255,255,0]; colorWheel['135'] = [204,255,0];
colorWheel['150'] = [153,255,0];
colorWheel['165'] = [51,255,0]; colorWheel['180'] = [0,204,0]; colorWheel['195'] = [0,178,102];
colorWheel['210'] = [0,153,153];
colorWheel['225'] = [0,102,178];
colorWheel['240'] = [0,51,204]; colorWheel['255'] = [25,25,178];
colorWheel['270'] = [51,0,153];
colorWheel['285'] = [64,0,153];
colorWheel['300'] = [102,0,153];
colorWheel['315'] = [153,0,153];
colorWheel['330'] = [204,0,153];
colorWheel['345'] = [229,0,102];
15度15度的旋转好计算
比如计算 [22.13.10] 旋转 12度在该色盘中应该是什么颜色？function getPosition( angle )
{
计算[22.13.10]最接近色盘中色彩的 colorWheel['下标']http://wellstyled.com/tools/colorscheme/index-en.html
????晕了不知道怎么做，他是怎么实现的呢？？？  分不够可在加
}

我看了人家不是写的挺好的吗！不知道有什么问题！
Color.prototype.rotate = function (angle) {
if (this.S>0 && this.V>0) {
var c = new Color(this.baseR,this.baseG,this.baseB);
var S1 = (c.S) ? this.S/c.S : 1;
var V1 = (c.V) ? this.V/c.V : 1;
var nh = (this.H + angle) % 360;
this.setHSV(nh,this.S,this.V);
c.setRGB(this.baseR,this.baseG,this.baseB);
var S2 = (c.S) ? this.S/c.S : 1;
var V2 = (c.V) ? this.V/c.V : 1;
this.setHSV(nh,this.S*S1/S2,this.V*V1/V2);
}
}
我基本的看了一下，基本上画了一个图像，然后画上面一些图层，获得一些焦点，当你点击鼠标的时候，看看左下脚，要执行的脚本。你就会发现，色盘中色彩调用的是angel(hue)函数，色盘最上方是1，然后从右到左旋转到360（实际跟手表的指针一样）。使用drawSample（）函数画到右边显示区。

但是他的HSV 是按他的HSV格式排列的

<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>Color类实例</title>
</head><body>
<script>
//+--------------------------------------------------------------------
//
//       Function:  Color
//
//      Arguments:  无
//
//         Return:  无
//
//    Description:  一个实现网页颜色各种功能模块的类
//
//+--------------------------------------------------------------------
function Color()
{
  this.r = 0; //**  红色，范围为0至125
  this.g = 0; //**  绿色，范围为0至125
  this.b = 0; //**  蓝色，范围为0至125

  //+--------------------------------------------------------------------
  //
  //       Function:  getHec
  //
  //      Arguments:  没有
  //
  //         Return:  本对象的十六进制表示法，比如#CECECE
  //
  //    Description:  通过调用Color.getHec来返回本身的十六进制表示法
  //
  //+--------------------------------------------------------------------
  this.getHec = function()
  {
    return Color.getHec(this);
  }

  //+--------------------------------------------------------------------
  //
  //       Function:  getRGB
  //
  //      Arguments:  没有
  //
  //         Return:  本对象的RGB表示法，比如rgb(255,255,255)
  //
  //    Description:  通过调用Color.getRGB返回本身的RGB表示法
  //
  //+--------------------------------------------------------------------
  this.getRGB = function()
  {
    return Color.getRGB(this);
  }

  //+--------------------------------------------------------------------
  //
  //       Function:  toString
  //
  //      Arguments:  没有
  //
  //         Return:  返回本身的十六进制表示法
  //
  //    Description:  重写对象的toString方法
  //
  //+--------------------------------------------------------------------
  this.toString = function()
  {
    return this.getHec();
  }
}//+--------------------------------------------------------------------
//
//       Function:  getColor
//
//      Arguments:  红、绿、蓝的十进制数值(范围为0-255)
//
//         Return:  相应的Color对象，如果R,G,B不能构成一个合法Color对象
//                  将会返回一个默认的Color对象，它的RGB为rgb(0,0,0)
//
//    Description:  通过传入的红、绿、蓝十进制数值返回相应的Color对象
//
//+--------------------------------------------------------------------
Color.getColor = function(R,G,B)
{
  R = parseInt(R);
  G = parseInt(G);
  B = parseInt(B);

  //**  注意下边的R != R，只有R为NaN的时候才成立，因为NaN是唯一不等于自身的常数
  //**  下一行判断R、G、B是否能够构成一个合法的Color对象
  if((R != R) || (G != G) || (B != B) || R < 0 || R > 255 || G < 0 || G > 255 || B < 0 || B > 255)
  {
    return null; //** 如果不能够构成返回null
  }
  else
  {
      //** 如果能够构成返回相应的Color对象
    var NewColor = new Color;
    NewColor.r = R;
    NewColor.g = G;
    NewColor.b = B;
    return NewColor;
  }
}//+--------------------------------------------------------------------
//
//       Function:  getHec
//
//      Arguments:  一个Color对象
//
//         Return:  参数对象的十六进制表示法，如果传入参数不合法，返回
//                  默认的Color对象，RGB为rgb(0,0,0)
//
//    Description:  能过传入一个Color对象返回十六进制表示法
//
//+--------------------------------------------------------------------
Color.getHec = function(PColor)
{
    //** 判断参数PColor是否为类Color的一个实例
  if(!(PColor instanceof Color))
  {
    return "#000000"; //** 如果PColor不是Color类的实例，返回默认十六进制表示法#000000
  }
  //** 如果PColor是Color类的实例，生成一个临时的Color实例tmpColor
  var tmpColor = Color.getColor(PColor.r,PColor.g,PColor.b);
  if(tmpColor == null)
  {
    return "#000000";//** 当PColor本身的r、g、b不合法，返回默认十六进制表示法#000000
  }
  else
  {
      //** 如果PColor合法，返回PColor的十六进制表示法
    //** 因为每一个色的表示有两位，就算值为1也必须以01表示，因此当该色的数值小于10给数
    //** 值前边添加一个0，否则调用Color.getHecStr得到十六进制的字符串
    var Red = PColor.r < 10 ? "0" + PColor.r : Color.getHecStr(PColor.r);
    var Green = PColor.g < 10 ? "0" + PColor.g : Color.getHecStr(PColor.g);
    var Blue = PColor.b < 10 ? "0" + PColor.b : Color.getHecStr(PColor.b);
    return "#" + Red + Green + Blue;
  }
}//+--------------------------------------------------------------------
//
//       Function:  getRGB
//
//      Arguments:  一个Color对象
//
//         Return:  PColor参数的RGB表示法，比如rgb(0,0,0)
//
//    Description:  通过传入一个Color对象返回该对象的RGB表示法，如果对
//                  象不合法，返回默认RGB表示法rgb(0,0,0)
//
//+--------------------------------------------------------------------
Color.getRGB = function(PColor)
{
  //** 判断参数PColor是否为类Color的一个实例
  if(!(PColor instanceof Color))
  {
    return "rgb(0,0,0)";//** 如果PColor不是Color类的实例，返回默认RGB表示法rgb(0,0,0)
  }
  var tmpColor = Color.getColor(PColor.r,PColor.g,PColor.b);
  if(tmpColor == null)
  {
    //** 当得到的临时Color对象为null时修改PColor的值为默认值0
    PColor.r = 0;
    PColor.g = 0;
    PColor.b = 0;
  }
  return "rgb(" + PColor.r + "," + PColor.g + "," + PColor.b + ")";
}//+--------------------------------------------------------------------
//
//       Function:  Create
//
//      Arguments:  1. 一个Color类的对象
//                  2. 十六进制表示法
//                  3. R、G、B十进制数值
//
//         Return:  1. 一个Color类的对象，返回跟参数对象相同的Color对象
//                  2. 十六进制表示法,比如#000000，返回相应的Color对象
//                  3. R、G、B十进制数值，返回相应的Color对象
//
//    Description:  新建一个Color对象，参数是不指明的，然后从arguments
//                  数组来判断参数的类型，关于arguments可以参考《Windows
//                  脚本技术》
//
//+--------------------------------------------------------------------
Color.Create = function()
{
    //** 得到arguments对象
  var Arg = arguments;

  //** 判断参数的个数，必须为1或者为3，否则返回默认Color对象(rgb为rgb(0,0,0))
  if(Arg.length != 1 && Arg.length != 3)
  {
    return new Color;
  }
  //** 当参数个数为0，则有可能参数是1和2的情况(查看函数说明Arguments)
  if(Arg.length == 1)
  {
    var Param = Arg[0];
    //** 当参数Param为Color对象，则为1情况
    if(Param instanceof Color)
    {
      var tmpColor = Color.getColor(Param.r,Param.g,Param.b);
      if(tmpColor == null)
      {
        return new Color;
      }
      return tmpColor;
    }
    //** 当参数为字符串，则有可能为2情况
    if(typeof(Param) == "string")
    {
        //** 利用正则表达式判断是否为十进制表示法
      var re = /^#[0-9A-Fa-f]{6}$/;
      if(re.test(Param))
      {
        var NewColor = new Color;
        NewColor.r = parseInt(Param.substr(1,2),16);
        NewColor.g = parseInt(Param.substr(3,2),16);
        NewColor.b = parseInt(Param.substr(5,2),16);
        return NewColor;
      }

//** 利用正则表达式判断是否为RGB表示法
      re = /^rgb$(\d{1,3}),(\d{1,3}),(\d{1,3})$$/g;
      if(re.test(Param))
      {
        var R = Param.replace(re,"$1");
        var G = Param.replace(re,"$2");
        var B = Param.replace(re,"$3");
        var tmpColor = Color.getColor(R,G,B);
        if(tmpColor == null)
        {
          return new Color;
        }
        return tmpColor;
      }
    }
    //** 如果参数没有一个合法，返回默认Color对象
    return new Color;
  }
  else
  {
      //** 得到三种颜色的值
    var R = Arg[0];
    var G = Arg[1];
    var B = Arg[2];
    //** 利用正则表达式判断是否为三个参数全部为数值，如果不是返回默认Color对象
    if(!(/^\d{1,3}$/.test(R) && /^\d{1,3}$/.test(G) || /^\d{1,3}$/.test(B)))
    {
      return  new Color;
    }
    //** 如果三种颜色为数值，得到该数值相应的Color对象
    var tmpColor = Color.getColor(R,G,B); //** 如果得到的临时对象为null返回默认Color对象
    if(tmpColor == null)
    {
      return new Color;
    }
    //** 返回Color对象
    return tmpColor;
  }
}//+--------------------------------------------------------------------
//
//       Function:  getHecStr
//
//      Arguments:  十进制数值
//
//         Return:  十六进制数值字符串
//
//    Description:  把传入的十进制数值转换成十六进制
//
//+--------------------------------------------------------------------
Color.getHecStr = function(Num)
{
  //+--------------------------------------------------------------------
  //
  //       Function:  getHec
  //
  //      Arguments:  十进制数值(范围在0-15之间)
  //
  //         Return:  十六进制数值字符串，如果范围不对返回原数值的字符串
  //
  //    Description:  把传入的十进制数值转换成十六进制，此函数为内部函数，
  //                  只能在Color.getHecStr里调用。
  //
  //+--------------------------------------------------------------------
  function getHec(Num)
  {

    if(Num < 10 || Num > 15)
    {
      return Num.toString();
    }
    switch(Num)
    {
      case 10: return "A";
      case 11: return "B";
      case 12: return "C";
      case 13: return "D";
      case 14: return "E";
      case 15: return "F";
    }
  }
  Num = parseInt(Num);
  if(Num != Num || Num < 0)
  {
    return "";
  }
  var NumStr = "";
  //** 进行十进制向十六进制的转换
  while(Num > 15)
  {
    NumStr = getHec(Num % 16) + NumStr;
    Num = (Num - Num % 16) / 16;
  }
  NumStr = getHec(Num) + NumStr;
  return NumStr;
}
//** 用平常方法声明一个对象
window.document.write("------------------以下是用声明的对象的使用方法----------------<br>");
var NColor = new Color();
NColor.r = 255;
NColor.g = 255;
NColor.b = 255;
window.document.write("得到十六进制的表示法：" + NColor.getHec() + "<br>");
window.document.write("得到RGB的表示法：" + NColor.getRGB() + "<br>");window.document.write("------------------以下是用Create新建对象的使用方法----------------<br>");
NColor.g = 0;
NColor.b = 0;
NColor = Color.Create(NColor);window.document.write("参数为Color对象得到十六进制的表示法：" + NColor.getHec() + "<br>");
window.document.write("参数为Color对象得到RGB的表示法：" + NColor.getRGB() + "<br>");NColor = Color.Create("#EFEFEF");
window.document.write("参数为十六进制字符串#EFEFEF得到十六进制的表示法：" + NColor.getHec() + "<br>");
window.document.write("参数为十六进制字符串#EFEFEF得到RGB的表示法：" + NColor.getRGB() + "<br>");NColor = Color.Create("rgb(123,123,123)");
window.document.write("参数为RGB字符串rgb(123,123,123)得到十六进制的表示法：" + NColor.getHec() + "<br>");
window.document.write("参数为RGB字符串rgb(123,123,123)#EFEFEF得到RGB的表示法：" + NColor.getRGB() + "<br>");NColor = Color.Create(200,200,200);
window.document.write("参数为数值200,200,200得到十六进制的表示法：" + NColor.getHec() + "<br>");
window.document.write("参数为数值200,200,200得到RGB的表示法：" + NColor.getRGB() + "<br>");
</script>
</body></html>

<HTML>
<HEAD>
<TITLE>颜色颜色选取器</TITLE>
<META content="text/html; charset=gb2312" http-equiv=Content-Type>
<STYLE type=text/css>TD {
    FONT-SIZE: 10.8pt
}
BODY {
    FONT-SIZE: 10.8pt
}
BUTTON {
    WIDTH: 5em
}
</STYLE> <SCRIPT language=JavaScript>
var SelRGB = '';
var DrRGB = '';
var SelGRAY = '120'; var hexch = new Array('0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F'); function ToHex(n)
{    var h, l;     n = Math.round(n);
    l = n % 16;
    h = Math.floor((n / 16)) % 16;
    return (hexch[h] + hexch[l]);
} function DoColor(c, l)
{ var r, g, b; r = '0x' + c.substring(1, 3);
g = '0x' + c.substring(3, 5);
b = '0x' + c.substring(5, 7); if(l > 120)
{
l = l - 120; r = (r * (120 - l) + 255 * l) / 120;
g = (g * (120 - l) + 255 * l) / 120;
b = (b * (120 - l) + 255 * l) / 120;
}else
{
r = (r * l) / 120;
g = (g * l) / 120;
b = (b * l) / 120;
} return '#' + ToHex(r) + ToHex(g) + ToHex(b);
} function EndColor()
{ var i; if(DrRGB != SelRGB)
{
DrRGB = SelRGB;
for(i = 0; i <= 30; i ++)
GrayTable.rows(i).bgColor = DoColor(SelRGB, 240 - i * 8);
} SelColor.value = DoColor(RGB.innerText, GRAY.innerText);
ShowColor.bgColor = SelColor.value;
}
</SCRIPT> <SCRIPT event=onclick for=ColorTable language=JavaScript>
SelRGB = event.srcElement.bgColor;
EndColor();
</SCRIPT> <SCRIPT event=onmouseover for=ColorTable language=JavaScript>
RGB.innerText = event.srcElement.bgColor;
EndColor();
</SCRIPT> <SCRIPT event=onmouseout for=ColorTable language=JavaScript>
RGB.innerText = SelRGB;
EndColor();
</SCRIPT> <SCRIPT event=onclick for=GrayTable language=JavaScript>
SelGRAY = event.srcElement.title;
EndColor();
</SCRIPT> <SCRIPT event=onmouseover for=GrayTable language=JavaScript>
GRAY.innerText = event.srcElement.title;
EndColor();
</SCRIPT> <SCRIPT event=onmouseout for=GrayTable language=JavaScript>
GRAY.innerText = SelGRAY;
EndColor();
</SCRIPT> <SCRIPT event=onclick for=Ok language=JavaScript>
window.returnValue = SelColor.value;
window.close();
</SCRIPT> <META content="MSHTML 5.00.2920.0" name=GENERATOR></HEAD>
<BODY bgColor=menu>
<DIV align=center>
<CENTER>
<TABLE border=0 cellPadding=0 cellSpacing=10>
<TBODY>
<TR>
<TD>
<TABLE border=0 cellPadding=0 cellSpacing=0 id=ColorTable
style="CURSOR: hand">
<SCRIPT language=JavaScript>
function wc(r, g, b, n)
{
    r = ((r * 16 + r) * 3 * (15 - n) + 0x80 * n) / 15;
    g = ((g * 16 + g) * 3 * (15 - n) + 0x80 * n) / 15;
    b = ((b * 16 + b) * 3 * (15 - n) + 0x80 * n) / 15;     document.write('<TD BGCOLOR=#' + ToHex(r) + ToHex(g) + ToHex(b) + ' height=8 width=8></TD>');
} var cnum = new Array(1, 0, 0, 1, 1, 0, 0, 1, 0, 0, 1, 1, 0, 0, 1, 1, 0, 1, 1, 0, 0); for(i = 0; i < 16; i ++)
{
document.write('<TR>');
for(j = 0; j < 30; j ++)
{
    n1 = j % 5;
    n2 = Math.floor(j / 5) * 3;
    n3 = n2 + 3;     wc((cnum[n3] * n1 + cnum[n2] * (5 - n1)),
        (cnum[n3 + 1] * n1 + cnum[n2 + 1] * (5 - n1)),
        (cnum[n3 + 2] * n1 + cnum[n2 + 2] * (5 - n1)), i);
} document.writeln('</TR>');
}
</SCRIPT> <TBODY></TBODY></TABLE></TD>
<TD>
<TABLE border=0 cellPadding=0 cellSpacing=0 id=GrayTable
style="CURSOR: hand">
<SCRIPT language=JavaScript>
for(i = 255; i >= 0; i -= 8.5)
document.write('<TR BGCOLOR=#' + ToHex(i) + ToHex(i) + ToHex(i) + '><TD TITLE=' + Math.floor(i * 16 / 17) + ' height=4 width=20></TD></TR>');
</SCRIPT> <TBODY></TBODY></TABLE></TD></TR></TBODY></TABLE></CENTER></DIV>
<DIV align=center>
<CENTER>
<TABLE border=0 cellPadding=0 cellSpacing=10>
<TBODY>
<TR>
<TD align=middle rowSpan=2>选中色彩
<TABLE border=1 cellPadding=0 cellSpacing=0 height=30 id=ShowColor
width=40>
<TBODY>
<TR>
<TD></TD></TR></TBODY></TABLE></TD>
<TD rowSpan=2>基色: <SPAN id=RGB></SPAN><BR>亮度: <SPAN
id=GRAY>120</SPAN><BR>代码: <INPUT id=SelColor size=7></TD>
<TD><BUTTON type=reset>重选</BUTTON></TD></TR>
<TR>
<TD><BUTTON
onclick=window.close();>关闭</BUTTON>
</TD>
</TR>
</TBODY>
</TABLE>
</CENTER>
</DIV>
</BODY>
</HTML>

调试易

300分的问题同时给上一个在线配色程序!!

解决方案 »

300分的问题 同时给上一个在线配色程序!!

解决方案 »

300分的问题同时给上一个在线配色程序!!