生成n色彩虹调色板

问题描述 投票:2回答:1

我正试图用(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);
}

但它不会产生丰富的15色彩色调色板,而是缺少一些颜色(例如鲜艳的黄色)。

enter image description here

是否有一个众所周知的算法来产生生动的彩虹色调?

colors processing rgb color-palette hsb
1个回答
2
投票

要了解发生了什么,请尝试创建一个程序,为每个值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);
}

你会看到这个:

请注意,“鲜艳的黄色”波段比绿色或蓝色波段更窄。这就是为什么简单地对每个X值进行采样不会产生黄色的原因。

黄色的颜色大约是值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);
}

或者你可以提前提出你想要的值并将它们放在一个数组中而不是使用均匀分布:

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);
}

© www.soinside.com 2019 - 2024. All rights reserved.