基于数字的颜色编码

Posted 2023-02-23

【中文标题】基于数字的颜色编码

【英文标题】：Color coding based on number

【发布时间】：2011-07-28 20:17:03

【问题描述】：

我想根据 1 到 100 之间的数字显示红色、黄色、绿色之间的颜色。

1 为绿色，100 为红色，50 为黄色。我想基本上在这之间创建一个渐变。

到目前为止，我尝试过：

$r = floor(255 * ($number / 100));
$g = 255 - $r;

它有点效果，但给我棕色和深色，根本没有黄色。

【问题讨论】：

Generate colors between red and green for an input range 的可能重复项

【参考方案1】：

看了一会儿，没有一个解决方案看起来令人愉悦。如上所述，HSV 可能是要走的路，因为现代浏览器可以很好地用它渲染颜色。

要了解您正在使用的颜色，请查看此色轮：

http://www.colorspire.com/rgb-color-wheel/

我想从蓝色开始，所以我使用 255 进行归一化。

function temp_color($temp)

    $start = 40;
    $end = 85;

    $normal = round(255-((($temp - $start)/($end-$start))*255));

    $color = "hsl($normal, 100%, 30%);";
    $span = "<span style=\"color: $color\">$temp</span>";

    return $span;
   

【参考方案2】：

我不知道通过指定 RGB 颜色值（例如您描述为绿色/黄色/红色）的“颜色曲线”的数学模型，它可以让您计算该曲线中的任何中间颜色.在任何情况下，函数模型（这将是什么）仅与它需要拟合的数据点一样好，因此您必须比绿色/黄色/红色更具体才能获得不错的结果即使有人指出数学。

请记住，我们在这里对数学插值不感兴趣，而是对“色彩空间插值”（我刚刚编造的一个术语）感兴趣——换句话说，看起来像人类的“自然”插值。

对于我们这些没有必要色彩理论知识的人来说，一个更简单的解决方案是使用颜色选择器工具预先选择多种颜色，将 0-100 范围划分为许多波段作为您选择的颜色，并使用简单的整数除法从 0-100 投影到一个颜色波段。

值得深思：的确，SO 如何决定 cmets 点赞数的颜色？

更新：我刚刚asked 上面的meta。让我们看看...

【讨论】：

how does SO decide the color of the upvote count for comments?魔术！

【参考方案3】：

这是因为你不应该同时改变两个通道，而是在前半部分提高 R，在后半部分降低 G。

试试这样的函数：

function GreenYellowRed($number) 
  $number--; // working with 0-99 will be easier

  if ($number < 50) 
    // green to yellow
    $r = floor(255 * ($number / 50));
    $g = 255;

   else 
    // yellow to red
    $r = 255;
    $g = floor(255 * ((50-$number%50) / 50));
  
  $b = 0;

  return "$r,$g,$b";

测试它：

$output = "";
for ($i = 1; $i <= 100; $i++) 
  $rgb = GreenYellowRed($i);
  $output .= "<div style='background-color: rgb($rgb)'>$rgb</div>";

echo $output;

【讨论】：

经过一些小的调整，这里是一个小提琴测试...jsfiddle.net/amackay11/xtb51wed/883

我花了一段时间才找到这样的解决方案。有了这样的结果。现在制作一个永久的 CSS 文件。塔！

@Olivier Pons：不知道你为什么在这里发布它，它只是遵循 OP 的约定。

【参考方案4】：

我发现处理HSV color model 比处理RGB model 更容易。它可以帮助您轻松选择要使用的颜色；使用 RGB，您需要了解 R、G 和 B 的不同值将如何组合为您提供您想要/不想要的颜色。

另外，这个 SO 问题可能很有用：How can I cycle through hex color codes in php?