Javascript 什么'；从指定颜色中获得高光颜色的合适算法是什么？

我有一个Javascript画布，我想用“高亮”颜色填充鼠标悬停时的矩形。我的矩形有一个动态颜色DC，所以它可以是任何颜色，从白色到黑色，甚至是透明的颜色。我需要一个算法来给我这个从DC开始的“高光”颜色

我想我必须在阈值T上测试亮度L：

如果L 这是不是一个好办法

---

我不知道该为白人和黑人做些什么。我应该选择合适的颜色吗？

您可以使用以下颜色：

检查此示例：

---

我的解决办法如下：

function colorLuminance(color, lum) {
      var hex = colorToHex(color);
      // validate hex string
      hex = String(hex).replace(/[^0-9a-f]/gi, '');
      if (hex.length < 6) {
          hex = hex[0]+hex[0]+hex[1]+hex[1]+hex[2]+hex[2];
      }
      lum = lum || 0;
      // convert to decimal and change luminosity
      var rgb = "#", c, i;
      for (i = 0; i < 3; i++) {
           c = parseInt(hex.substr(i*2,2), 16);
           c = Math.round(Math.min(Math.max(0, c + (c * lum)), 255)).toString(16);
           rgb += ("00"+c).substr(c.length);
      }
      return rgb;
}

function colorToHex(c) {
     var m = /rgba?\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)/.exec(c);
     return m ? '#' + (1 << 24 | m[1] << 16 | m[2] << 8 | m[3]).toString(16).substr(1) : c;
}

//returns brightness value from 0 to 255
function get_brightness(hexCode) {
    // strip off any leading #
    hexCode = hexCode.replace('#', '');

    var c_r = parseInt(hexCode.substr(0, 2),16);
    var c_g = parseInt(hexCode.substr(2, 2),16);
    var c_b = parseInt(hexCode.substr(4, 2),16);

    return ((c_r * 299) + (c_g * 587) + (c_b * 114)) / 1000;
}

function highlightColor(color, lum) {
    var hex = colorToHex(color);    
    if (get_brightness(hex) > 160) {
        // too bright, need to darken it
        if (lum > 0) {
            lum = -lum;
        }       
    } else {        
        if (lum < 0) {
            lum = -lum;
        }
    }   
    return colorLuminance(color, lum);
}

功能色亮度（颜色，亮度）{
var hex=colorToHex（颜色）；
//验证十六进制字符串
十六进制=字符串（十六进制）。替换（/[^0-9a-f]/gi'）；
如果（十六进制长度<6）{
十六进制=十六进制[0]+十六进制[0]+十六进制[1]+十六进制[1]+十六进制[2]+十六进制[2]；
}
lum=lum | | 0；
//转换为十进制并更改亮度
var rgb=“#”，c，i；
对于（i=0；i<3；i++）{
c=parseInt（十六进制substr（i*2,2），16）；
c=Math.round（Math.min（Math.max（0，c+（c*lum）），255））.toString（16）；
rgb+=（“00”+c）.子字符串（c.长度）；
}
返回rgb；
}
函数colorToHex（c）{
var m=/rgba？\（\s*（\d+）\s*，\s*（\d+）\s*，\s*（\d+）/.exec（c）；
return m？“#”+（1如果你重新措辞，可能是一个好问题。寻找“最好”通常不是一个可以回答的问题。将其改为“合适”而不是“最好”；“相反”的颜色如何？：P你的方法对我来说似乎有效。对于白色和黑色，我会选择灰色。不确定“突出”是什么对你来说意味着。你的目标是找到一种与你拥有的颜色具有高对比度的颜色吗？对我来说，“突出显示的颜色”意味着一种相同细微差别的颜色，但有一点不同（亮度）通过人眼辨别。感谢Carlos给出的非常好的答案，但我只是想得到一种更亮或更暗的颜色。我最终做了：我找到了a，并计算了颜色的亮度。根据这个亮度值（我选择了一个对我有效的阈值160），我改变了亮度，如中所示。
function colorLuminance(color, lum) {
      var hex = colorToHex(color);
      // validate hex string
      hex = String(hex).replace(/[^0-9a-f]/gi, '');
      if (hex.length < 6) {
          hex = hex[0]+hex[0]+hex[1]+hex[1]+hex[2]+hex[2];
      }
      lum = lum || 0;
      // convert to decimal and change luminosity
      var rgb = "#", c, i;
      for (i = 0; i < 3; i++) {
           c = parseInt(hex.substr(i*2,2), 16);
           c = Math.round(Math.min(Math.max(0, c + (c * lum)), 255)).toString(16);
           rgb += ("00"+c).substr(c.length);
      }
      return rgb;
}

function colorToHex(c) {
     var m = /rgba?\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)/.exec(c);
     return m ? '#' + (1 << 24 | m[1] << 16 | m[2] << 8 | m[3]).toString(16).substr(1) : c;
}

//returns brightness value from 0 to 255
function get_brightness(hexCode) {
    // strip off any leading #
    hexCode = hexCode.replace('#', '');

    var c_r = parseInt(hexCode.substr(0, 2),16);
    var c_g = parseInt(hexCode.substr(2, 2),16);
    var c_b = parseInt(hexCode.substr(4, 2),16);

    return ((c_r * 299) + (c_g * 587) + (c_b * 114)) / 1000;
}

function highlightColor(color, lum) {
    var hex = colorToHex(color);    
    if (get_brightness(hex) > 160) {
        // too bright, need to darken it
        if (lum > 0) {
            lum = -lum;
        }       
    } else {        
        if (lum < 0) {
            lum = -lum;
        }
    }   
    return colorLuminance(color, lum);
}