2010-08-10 177 views
0

我在如何插入颜色摔跤,给定start_timeend_time,start_colorend_color。为简单起见,这里是我怎么想的只有红色成分做的一个例子:插值RGB颜色

start_time = 0 
end_time = 1 
start_color = F //base 16 ftw 
end_color = 0 

我可以看到在时间3.5,red_out应该是8。这将通过褪色是中途鲜红到黑色。

那么它是time_elapsed * start_color?但是,如果它从另一个方面消失,从黑色到鲜红色呢?这是我感到困惑的地方。

+0

好东西,所有。 var(red_out = time_alive *(pArray [i] .pEndColorRed - pArray [i] .pStartColorRed)/(now - pArray [i] .pStarttime).toString(16); – jason 2010-08-10 15:25:12

+0

啊,这是正式的代码的最丑陋线伊夫everwrote洛尔

变种RED_OUT = (Math.abs(parseInt函数((time_alive *(粒子阵列[I] .pEndColorRed - 粒子阵列[I] .pStartColorRed)/( pArray [i] .pLifespan)))))。toString(16); – jason 2010-08-10 16:00:12

+0

@lincolnk:这里会有新的功能 – jason 2010-08-10 16:01:04

回答

1

你必须用下面的公式(什么神奇)每种颜色分量:

color = time_elapsed * (end_color - start_color)/(end_time - star_time) 
1

另一种方法似乎很简单,如果你认为在时间t(其中t为0〜1)中,信道的值是:

start + t * (end - start) 

这种方式,如果结束值大于起始值(如在红色 - >黑色情况下)少,所述end - start子句是否定的,那么随着时间的增加价值根据需要减少

它也看到,在边缘的情况下,

t = 0 => start + 0 = start 
t = 1 => start + (end - start) = end 

的要求。

编辑:这种表示的好处是它清楚如何修改衰减率。只要t的值从0开始并最终达到1,它不一定必须线性修改。例如,如果您想要插值缓慢地开始并加速到最后,您可以改为使用t代替。

1
interpolated_color_component = (current_time - start_time)/(end_time - start_time) * (end_color_component - start_color_component) + start_color_component