•  05-07-2019
  •  | 
  •  

题

我正在尝试在表单上显示某些值。它们的范围从0到200，我希望0左右的那些是绿色，并且当它们变为200时变为亮红色。

基本上该功能应根据输入的值返回颜色。有什么想法吗？

有帮助吗？

解决方案

基本上，两个值之间平滑过渡的一般方法是以下函数：

function transition(value, maximum, start_point, end_point):
    return start_point + (end_point - start_point)*value/maximum

给定的是，您定义了一个为三元组（RGB，HSV等）进行转换的函数。

function transition3(value, maximum, (s1, s2, s3), (e1, e2, e3)):
    r1= transition(value, maximum, s1, e1)
    r2= transition(value, maximum, s2, e2)
    r3= transition(value, maximum, s3, e3)
    return (r1, r2, r3)

假设你有 s 和 e 三元组的RGB颜色，你可以按原样使用transition3功能。然而，通过HSV颜色空间产生更多的“自然”颜色空间。过渡。所以，考虑到转换函数（从Python colorsys模块无耻地窃取并转换为伪代码:)：

function rgb_to_hsv(r, g, b):
    maxc= max(r, g, b)
    minc= min(r, g, b)
    v= maxc
    if minc == maxc then return (0, 0, v)
    diff= maxc - minc
    s= diff / maxc
    rc= (maxc - r) / diff
    gc= (maxc - g) / diff
    bc= (maxc - b) / diff
    if r == maxc then
        h= bc - gc
    else if g == maxc then
        h= 2.0 + rc - bc
    else
        h = 4.0 + gc - rc
    h = (h / 6.0) % 1.0 //comment: this calculates only the fractional part of h/6
    return (h, s, v)

function hsv_to_rgb(h, s, v):
    if s == 0.0 then return (v, v, v)
    i= int(floor(h*6.0)) //comment: floor() should drop the fractional part
    f= (h*6.0) - i
    p= v*(1.0 - s)
    q= v*(1.0 - s*f)
    t= v*(1.0 - s*(1.0 - f))
    if i mod 6 == 0 then return v, t, p
    if i == 1 then return q, v, p
    if i == 2 then return p, v, t
    if i == 3 then return p, q, v
    if i == 4 then return t, p, v
    if i == 5 then return v, p, q
    //comment: 0 <= i <= 6, so we never come here

，您可以拥有以下代码：

start_triplet= rgb_to_hsv(0, 255, 0) //comment: green converted to HSV
end_triplet= rgb_to_hsv(255, 0, 0) //comment: accordingly for red

maximum= 200

… //comment: value is defined somewhere here

rgb_triplet_to_display= hsv_to_rgb(transition3(value, maximum, start_triplet, end_triplet))

其他提示

你没有说你在做什么环境。如果您可以使用 HSV颜色，通过设置S = 100可以很容易地做到这一点和V = 100，并通过以下方式确定H：

H = 0.4 * value + 120

从HSV转换为RGB 也相当容易。

[编辑]注意：与其他一些提议的解决方案相比，这将改变颜色绿色 - ＆gt;黄色 - ＆gt;橙色 - ＆gt;红色。

red = (float)val / 200 * 255;

green = (float)(200 - val) / 200 * 255;

blue = 0;

return red << 16 + green << 8 + blue;

选择你喜欢的绿色（RGB1 =＃00FF00，例如）和你喜欢的红色（RGB2 =＃FF0000，例如），然后像这样计算颜色

R = R1 * (200-i)/200 + R2 * i/200
G = G1 * (200-i)/200 + G2 * i/200
B = B1 * (200-i)/200 + B2 * i/200

为获得最佳的可控效果和准确效果，您应该使用HSV色彩空间。使用HSV，您可以轻松地将Hue，Saturation和/或Brightness彼此分开。然后，您将转换为RGB。

延伸@ tzot的代码...你也可以在起点和终点之间设置一个中点，如果你想要一个“过渡颜色”，这可能很有用！

//comment: s = start_triplet, m = mid_triplet, e = end_triplet
function transition3midpoint = (value, maximum, s, m, e):
    mid = maximum / 2
    if value < mid
      return transition3(value, mid, s, m)
    else
      return transition3(value - mid, mid, m, e)

浏览这篇维基百科文章，我个人会选择一个通过色彩空间的路径，将值映射到该路径。

但这是一个直接的功能。我认为您可能更适合使用快速颜色的javascript颜色选择器，它将为您提供Hex，并且您可以存储Hex。

如果像Peter Parker建议的那样使用红色和绿色值的线性斜坡，则值100的颜色基本上是呕吐绿色（127,127,0）。理想情况下，你希望它在那个中点是一个明亮的橙色或黄色。为此，您可以使用：

Red = max(value / 100, 1) * 255
Green = (1 - max(value / 100, 1)) * 255
Blue = 0
许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top