如何生成具有多个颜色停止的线性渐变?

时间:2017-07-10 02:57:50

标签: math colors interpolation gradient

说我需要三种颜色之间的线性渐变。

rgb(255, 000, 000)
rgb(255, 255, 000)
rgb(000, 255, 000)

如何计算给定长度的单条线的线性插值?这是一个简单的行,如下所示。

enter image description here

如果给定一个颜色停止列表/数组,我如何创建一个函数,从输入中输出所有插值颜色值的另一个数组?

上面的图像可供我使用,但我需要能够在输入长度上生成多个色彩停止的RGB阵列。

OR ,另一个选项是根据颜色停止数组和沿线的点返回单个颜色样本的函数。

该功能如下:sample(stops[rgb...], point, length)

我尝了几次,但放弃了,因为我不知道如何开始。我尝试将其视为三个独立色带的视角,但它仍然没有完全匹配。

我知道这是一个数学脑块的简单案例,并且这不是一个特定于编程的问题,但我不知道还有什么要问。

P.S:任何理智的编程语言都可以回答。不要尝试用看起来像正则表达式的东西给出答案。

1 个答案:

答案 0 :(得分:0)

您应该以给定的间隔对每个颜色分量进行线性插值。

我们有N个间隔,所以N + 1个节点。节点包含范围0..1和RGB颜色的位置。

RGBColor NodeColors[N+1]
Double NodePositions[N+1]

要从开头到达给定距离的颜色,您必须确定区间数K.

如果线条图从开始到结束,只需将当前距离与NodePositions条目进行比较,并在需要时增加K.

DistNorm = Dist / Length;

while (DistNorm > NodePositions[K])
    K++

如果您想在该行获得任意点,请使用二进制搜索

  K = BinarySearch(DistNorm, NodePositions)

当你有间隔号时,计算这个间隔的线性插值

 Red = NodeColors[K].Red + 
      (NodeColors[K+1].Red - NodeColors[K].Red) * 
      (DistNorm - NodePositions[K]) / 
      (NodePositions[K+1] - NodePositions[K]) 
same for Green, Blue