Question

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

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

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

Answer 1

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

看起来像a similar question has been asked before here。

Answer 2

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

在生理学上，人类对于色调或饱和度的强度具有更好的分辨率。这就是为什么模拟电视，数字视频和照片压缩会丢弃颜色信息以减少带宽（4:2:2） - 如果你将两个不同强度的像素放在一起，它们的颜色并不重要 - 我们只需要只感觉大范围强度的颜色差异。

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

Answer 3

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

构造颜色以获得最大对比度

3 个答案: