[英]Generate a n-color rainbow palette
I'm trying to generate a rainbow with 15 different colors with ( runnable code here ):我正在尝试使用(此处为可运行代码)生成具有 15 种不同颜色的彩虹:
size(360,100);
colorMode(HSB, 360, 100, 100); // Hue in degrees in [0, 360],
// saturation/brightness in [0, 100]
// like in Photoshop
noStroke();
for (int i = 0; i < 15; i++)
{
fill(i*24, 100, 100); // 24*15 = 360
rect(i*24, 0, 25, 100);
}
but it doesn't produce a rich 15 rainbow-color palette, instead some colors are missing (vivid yellow for example).但它不会产生丰富的 15 彩虹调色板,而是缺少一些颜色(例如鲜黄色)。
Is there a well known algorithm to produce a vivid rainbow color palette?是否有一种众所周知的算法来产生生动的彩虹调色板?
To understand what's going on, try creating a program that shows a line for each value 0-360:要了解发生了什么,请尝试创建一个程序,为 0-360 的每个值显示一行:
size(360,100);
colorMode(HSB, 360, 100, 100);
noStroke();
for (int i = 0; i < 360; i++)
{
fill(i, 100, 100);
rect(i, 0, 1, 100);
}
You'll see this:你会看到这个:
Notice that the "vivid yellow" band is much more narrow than, for example, the green or blue bands.请注意,“鲜艳的黄色”带比例如绿色或蓝色带窄得多。 That's why simply sampling every X values doesn't generate a yellow color.
这就是为什么简单地对每个 X 值进行采样不会产生黄色的原因。
The yellow color is around value 60
, so you could modify your increment so it lands on 60. Drawing 12 rectangles with a width of 30 lets you land on the yellow:黄色大约为
60
值,因此您可以修改增量使其落在 60 上。绘制 12 个宽度为 30 的矩形可以让您落在黄色上:
size(360,100);
colorMode(HSB, 360, 100, 100);
noStroke();
for (int i = 0; i < 360; i++)
{
fill(i*30, 100, 100);
rect(i*30, 0, 30, 100);
}
Or you could come up with the values you want ahead of time and put them in an array instead of using an even distribution:或者你可以提前想出你想要的值并将它们放在一个数组中而不是使用均匀分布:
int[] hueValues = {0, 15, 30, 60, 90, 120, 150, 180, 210, 225, 240, 270, 300, 330, 360};
size(360,100);
colorMode(HSB, 360, 100, 100);
noStroke();
for (int index = 0; index < hueValues.length; index++)
{
float rectWidth = width/hueValues.length;
fill(hueValues[index], 100, 100);
rect(index*rectWidth, 0, rectWidth, height);
}
I created a function that generates N colors (rainbow) and outputs a list of strings (Hex values).我创建了一个生成 N 种颜色(彩虹)并输出字符串列表(十六进制值)的函数。 This is in C# but logic can be converted.
这是在 C# 中,但可以转换逻辑。 In order to understand what's going on I graphed the red, blue, and green values vs n.
为了了解发生了什么,我绘制了红色、蓝色和绿色值与 n 的关系图。 Doing that you'll see the three graphs each are piecewise functions with points of interest at n=0, n=1/4, n=1/2 and n=3/4.
这样做后,您会看到三个图形都是分段函数,感兴趣的点位于 n=0、n=1/4、n=1/2 和 n=3/4。
List<string> GenerateRainbowPalette(int numColors)
{
var toRet = new List<SKColor>();
var n = (float)numColors;
for(var i = 0; i< numColors; i++)
{
int red = 255;
int green = 0;
int blue = 0;
//red: (first quarter)
if (i <= n / 4)
{
red = 255;
green = (int)(255 / (n / 4) * i);
blue = 0;
}
else if (i <= n / 2) //2nd quarter
{
red = (int)((-255)/(n/4)*i + 255 * 2);
green = 255;
blue = 0;
}
else if (i <= (.75)*n)
{ // 3rd quarter
red = 0;
green = 255;
blue = (int)(255 / (n / 4) * i + (-255 * 2));
}
else if(i > (.75)*n)
{
red = 0;
green = (int)(-255 * i / (n / 4) + (255 * 4));
blue = 255;
}
//generate hex string:
var redHex = red.ToString("X2");
var greenHex = green.ToString("X2");
var blueHex = blue.ToString("X2");
var color = $"#{redHex}{greenHex}{blueHex}";
toRet.Add(color);
}
return toRet;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.