构建颜色以获得最大对比度答案

【问题标题】：Constructing colours for maximum contrast构建颜色以获得最大对比度
【发布时间】：2011-02-10 20:43:22
【问题描述】：

我想在屏幕上绘制一些项目，每个项目都在 N 个集合中。集合的数量一直在变化，所以我需要计算出尽可能不同的N种不同颜色（以便于识别是哪个集合）。

因此，例如，如果 N = 2，我的结果将是黑白的。有了三个，我想我会得到全红，全绿，全蓝。对于所有四个，正确答案是什么不太明显，这就是我遇到麻烦的地方。

编辑:: 显而易见的方法是将 0 映射到红色，将 1 映射到绿色，并将其间的所有颜色映射到适当的彩虹色，然后您可以通过 GetRainbowColour(N / TotalSets) 获得集合 N 的颜色，所以解决这个问题只需要一个 GetRainbowColour 方法

【问题讨论】：

标签： algorithm language-agnostic math graphics colors

【解决方案1】：

感谢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;
};

【讨论】：

【解决方案2】：

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

从生理上讲，人类对强度的分辨率比对色调或饱和度的分辨率要高得多。这就是为什么模拟电视、数字视频和照片压缩会丢弃颜色信息以减少带宽（4:2:2）——如果你把两个不同强度的像素放在一起，它们是什么颜色并不重要——我们只是能感觉到大面积类似强度的颜色差异。

因此，如果您要显示的东西有很多只有几个像素的小区域，或者您希望它在黑暗中使用（在黑暗中，大脑会增强蓝色细胞，而我们看不到颜色以及）或 10% 的色盲男性，考虑使用强度而不是色调作为主要区别因素。 GetRainbowColour 会忽略人类视觉最重要的维度，但可以很好地处理连续数据。

【讨论】：

我不知道，谢谢。但是，UI 是一个调试 UI，所以我知道使用它的人都不是色盲。但是，我会在未来牢记这一点。

【解决方案3】：

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

【讨论】：