让我们考虑以下场景:一个函数可以生成从白色到红色、从白色到蓝色、从白色到粉色、从白色到橙色等的代码颜色。
颜色代码采用 RGB 格式,值从 0 到 255。
有任何想法吗?你能给我这个算法的伪代码或链接吗?
听起来你在进行线性插值- 在你的情况下,从白色插值到指定的颜色。例如,在 C# 中:
public IEnumerable<Color> Interpolate(Color from, Color to, int steps)
{
int range = steps-1; // Makes things a bit easier
for (int i=0; i < steps; i++)
{
// i is the proportion of the "to" colour to use.
// j is the proportion of the "from" colour to use.
int j = range - i;
int r = ((from.R * j) + (to.R * i)) / range;
int g = ((from.G * j) + (to.G * i)) / range;
int b = ((from.B * j) + (to.B * i)) / range;
yield return new Color(r, g, b);
}
}
当然,除了线性插值之外还有其他方法,但这可能是最简单的。请注意,如果您有很多步骤或更大的值,这会变得很棘手,因为您需要考虑溢出的可能性。在这种情况下你应该没问题 - 你不太可能想要超过 256 步,最大值是 255,所以你不会接近int
s 的限制。
编辑:如评论中所述,RGB 可能不是使用线性插值的最佳域。您最好将 from/to RGB 值转换为HSL 或 HSV,并对它们进行插值。根据您的平台,这可能很容易或很棘手。如果没有为您提供适当的计算公式,上一句中的维基百科链接会给出相应的计算公式。
算法:
例如,如果一个极端是(0,0,0),另一个极端是(0,255,255),那么这两种颜色之间的中间值是(0,128,128)......并且值是这些颜色之间四分之一的值两个值是(0,64,64)。
通过已知的特定点对颜色进行插值通常用于构建图形数据的配色方案。显式插值公式的替代方法是选择在其表示背后有一些设计的配色方案。这种方案的一个很好的来源是ColorBrewer。
即使您需要插值,从精心设计的配色方案开始也可以产生更多可用的结果。
从你想要渐变的两种颜色开始,然后将它们分成 R、G 和 B 部分。
决定要淡出多少个“步骤”。
将 R、G 和 B 部分之间的差异除以步数。现在,每种颜色都有一个“阶梯差”。
循环遍历每个步骤,并为每次迭代将步长差添加到颜色值一次。你做的最后一件事是四舍五入到整数。
你想改成什么颜色?白色到红色只是从 255 255 255 开始并递减后两个直到你有 255 0 0 的情况。蓝色将保留最后一个值并递减以结束 0 0 255 等