编码我想显示红色,黄色,绿色视1之间的数之间的颜色为100。颜色基于数
1为绿色,100是红色,50是黄色。我想基本上创建之间的梯度。
到目前为止,我想:
$r = floor(255 * ($number/100));
$g = 255 - $r;
它有些做的,但给我的褐色&暗的颜色,&没有黄色的。
编码我想显示红色,黄色,绿色视1之间的数之间的颜色为100。颜色基于数
1为绿色,100是红色,50是黄色。我想基本上创建之间的梯度。
到目前为止,我想:
$r = floor(255 * ($number/100));
$g = 255 - $r;
它有些做的,但给我的褐色&暗的颜色,&没有黄色的。
那是因为你不应该一次更改两个通道,但上升的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;
随着一些小的调整,这里是一个小提琴测试... http://jsfiddle.net/amackay11/xtb51wed/883/ – amackay11 2016-04-28 14:57:04
它也是我一会儿找到这样的解决方案。有了这样的结果。现在创建一个永久的CSS文件。 TA! – 2017-04-05 14:28:53
@Olivier Pons:不知道你为什么要在这里发布,它只是遵循OP的约定。 – Czechnology 2017-07-15 12:51:05
我发现处理HSV color model比RGB model更容易。它可以帮助您轻松选择想要使用的颜色;使用RGB时,您需要了解R,G和B的不同值将如何组合,以提供您想要/不想要的颜色。
而且,这太问题可能是有用的:How can I cycle through hex color codes in PHP?
我不知道,通过指定的RGB颜色值通过“颜色曲线”的数学模型(例如,您所描述的为绿色/黄色/红色),这将允许您计算该曲线中的任何中间色。在任何情况下,函数模型(就是这样)只与它需要的数据点一样好,所以你必须比绿色/黄色/红色更具体才能获得不错的结果即使有人指出数学。
请记住,我们不感兴趣的数学这里插值,而是在“色彩空间插值”(我只是做了一个学期) - 换句话说,会是什么样子“自然”插值到人类。
对于我们这些没有必要的色彩理论知识并且我认为是的人来说,更简单的解决方案是用颜色选择器工具预先选择多种颜色,将0-100范围分成与您选择的颜色一样多的乐队,并使用简单的整数除法从0-100投影到彩色乐队。
思考的问题:确实,SO如何决定评论的upvote计数颜色?
更新:我只是asked以上在元。让我们来看...
'如何决定评论的最佳点数颜色?魔术! – Czechnology 2011-04-03 23:57:03
经过一番研究,没有一个解决方案看起来令人愉快。如上所述,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;
}
可能重复(http://stackoverflow.com/questions/11849308/generate-colors-between-red-and-green-for-an-输入范围) – Neal 2012-12-12 13:50:54