构造最大对比度的颜色

问题描述：

我想在屏幕上绘制一些项目，每个项目都在N组中。组的数量总是在变化，所以我需要计算N种不同的颜色，这些颜色尽可能不同（以便识别哪些颜色在哪一组中）。构造最大对比度的颜色

因此，例如对于N = 2，我的结果将是黑色和白色。有三个我想我会得到全红，全绿，全蓝。对于所有四个人来说，正确的答案并不那么明显，而这正是我遇到麻烦的地方。

编辑::显而易见的方法是映射0到红色，1到绿色，并在所有的颜色之间的适当的彩虹颜色，然后你可以通过做GetRainbowColour（N/TotalSets），所以需要GetRainbowColour方法来解决这个问题

答

您可以阅读wikipedia article中的HSL和HSV颜色模型。首字母缩略词中的“H”代表色相，这就是你想要的彩虹。这听起来像你想饱和最大化。文章还解释了如何转换为RGB颜色。

答

这个问题的答案是主观的 - 与全视力的人相比，最好的对比不一定与色盲或视力有限的人或在黑暗环境中操作设备的视力正常的人形成最佳对比。

生理上，人类对色调或饱和度的强度分辨率要好得多。这就是为什么模拟电视，数字视频和照片压缩会丢弃颜色信息以减少带宽（4:2:2） - 如果您将两个不同强度的像素放在一起，则它们的颜色无关紧要 - 我们只能感知颜色差异在类似强度的大面积上。所以如果你试图展示的东西有许多只有几个像素的小区域，或者你希望它在黑暗中使用（在黑暗中，大脑提升蓝色细胞，我们看不到颜色）或10％的色盲男性人群，考虑使用强度作为主要区分因素而不是色调。 GetRainbowColour会忽略人类视觉最重要的维度，但对连续数据可以很好地工作。

我不知道，谢谢。但是，UI是一个调试UI，因此我知道使用它的人都不是色盲。然而，我会为未来铭记这一点。 – Martin 2010-04-22 10:45:41

答

谢谢brainjam，建议使用HSL。我掀起了这个似乎很适合堆叠图形的小函数：

var contrastingColors = function(len) { 
    var result = []; 
    if (len > 0) { 
     var h = [0, 180];      // red, cyan 
     var shft = 360/len; 
     var flip = 0; 
     var l = 50; 
     for (var ix = 0; ix < len; ix++) { 
      result.push("hsl(" + h[flip] + ",100%," + l + "%)"); 
      h[flip] = (h[flip] + shft) % 360; 
      flip = flip ? 0 : 1; 
      if (flip == 0) { 
       l = (l == 50) ? 30 : (l == 30? 70 : 50); 
      } 
     } 
    } 
    return result; 
};

构造最大对比度的颜色

相关推荐