Javascript 随机颜色生成器，但偏爱强烈的颜色答案

【问题标题】：Javascript random color generator, but with favouritism to strong colorsJavascript 随机颜色生成器，但偏爱强烈的颜色
【发布时间】：2013-03-24 07:52:18
【问题描述】：

我目前正在使用以下内容在 javascript 中生成随机十六进制颜色：

function getColor(){
     return '#'+(0x1000000+(Math.random())*0xffffff).toString(16).substr(1,6);
}

每次生成这些颜色中的一种时，它们都会被推入一个数组中：

var colors = new Array();

我希望 getColor 函数始终首先从“整体”颜色中进行选择。例如“红色”(#FF0000) 和“黄色”(#FFFF00)，并且只有在通过检查颜色数组确认所有这些“完整”颜色已经被采用后，它才应该继续提供更模糊/混合的颜色，例如如“GreenYellow”（#ADFF2F）等。

所以本质上，该函数最终应该用每种基于十六进制的颜色填充颜色数组，从最强的颜色（我描述为“整体”颜色）开始，然后转向较弱的“混合”颜色，最后以黑色结尾，因为它被认为是最不受欢迎的。

不幸的是，除了按照我想要的确切顺序提供完整的颜色数组然后遍历它们之外，我真的不知道从哪里开始。

这似乎更像是用大锤敲碎坚果。任何其他更优雅的解决方案将不胜感激。

提前致谢。

请注意：我知道我在这里使用的术语并不正确，但希望人们能理解我所说的“整体”颜色是什么意思。我实在想不出更好的表达方式。

编辑：这可能有助于了解需要这个的原因。颜色将用于在视觉上识别开始于同一组的项目，因为用户将它们自己组合在一起。大多数时候只有几组，平均可能多达 20-30 组。因此，在使用可能看起来更相似的颜色之前，先使用清晰可见并相互区分的强烈颜色是有意义的。

【问题讨论】：

我认为你需要更好地描述这个数组应该如何填充以及以什么顺序填充。看你的描述真的不是很清楚。试着把它写成一系列步骤或流程图。在这种情况下，确切地是什么意思？因为看起来您所描述的内容（以“完整”颜色开头并以黑色结尾）并不是完全随机的。那么它只是部分随机的吗？或者根本不是随机的？
你真的是指#FF60000，因为对我来说“全红”就是#FF0000
确实，我发现它很难表达。我很抱歉。部分随机将是描述我的需求的最佳方式。整个颜色，然后是所有其他颜色，最后是黑色。
@MattBurland - 对不起，那是一个类型-o。
“全色”作为原色？对于混合颜色，RGB 颜色空间不能很好地工作。尝试使用HSV 色彩空间。

标签： javascript colors

【解决方案1】：

生成看起来不同的颜色更多地是关于人类的感知而不是数学。在 RGB 值中相隔相同距离的某些颜色对看起来比其他颜色对更相似。

即便如此，我认为您不想在 RGB 中解决这个问题。相反，请尝试在 HSL 或 HSV 中生成颜色：http://en.wikipedia.org/wiki/HSL_and_HSV

这允许控制色调、饱和度和亮度，这更接近人类对颜色的感知属性。然后，您可以通过改变其他属性不变的色调来生成颜色。

// assume hue is in degrees here
// think of hue like a circle with each angle a different color.
red     = hsv(0,   1, 1);
green   = hsv(120, 1, 1);
blue    = hsv(240, 1, 1);

然后您可以开始更紧密地细分色调空间。

yellow  = hsv(60,  1, 1);
cyan    = hsv(180, 1, 1);
magenta = hsv(300, 1, 1);

一旦色调接近接近，降低饱和度或亮度，然后再做一次。

// run through all hues again but with half the value
darkRed = hsv(0, 1, 0.5);

// run through all hues again but with half the saturation
lightRed = hsv(0, 0.5, 1);

// run through all hues again but with half the value and half the saturation
desatRad = hsv(0, 0.5, 0.5);

然后您甚至可以将饱和度/值空间细分为 0.25 和 0.75。我所描述的是一种递归算法的策略，它生成尽可能独特的颜色，首先返回最大胆/最亮的颜色。而且它也不是随机的，因为它不需要。

您只需要一个 hsv/hsl 到 javascript 中的十六进制库，我敢肯定在某处有一个，还有一些数学运算。

【讨论】：

这绝对是正确的，而且绝对是正确的方法。我不敢相信我一开始就没有考虑改用 HSV。非常感谢。

【解决方案2】：

如果您将色块减少到 256 种或更少颜色会更容易，前提是该颜色数量足够，因为人眼很难区分 #0000FF 和 #0000FE。

我不确定我是否理解您在该数组上需要不重复的颜色，如果是这样，您将需要检查以前的值以获得唯一的颜色。

【讨论】：