我正在创建一个功能来创建像这样的图像Image link
我的意思是我想显示像
0%-1%绿色至浅绿色
1%-3%黄色至浅黄色
3%-5%橙色至浅橙色
5%-6红色至深红色
目前,我认为只有在if else条件下才有可能。
我通过以下方式进行操作:
function getBackground($val) {
if($val<=0.3)
return "#0A3A0A";
if($val< 0.5)
return "#1E4E1E";
if($val< 1)
return "#508050";
if($val< 1.4)
return "#FFFF0A";
if($val< 1.8)
return "#FFFF1E";
if($val< 2)
return "#FFFF32";
if($val< 2.4)
return "#FFFF46";
return "red";
}
并以这种方式在html中。在循环1-15中
$class=getBackground($val);
echo "<li style='background:{$class}'>{$val}%</li>";
但我认为这不是一个好的解决方案,因为我必须为每种情况创建if否则。
有一个更好的方法吗?如果是的话,请给我建议。
更新:
主要问题是:
如果值为0.2%,则颜色将表现为绿色;如果值为o.6%,则颜色将变为绿色,依此类推。如果是0.9%,它将变绿。
我正在寻找一种显示不同颜色的解决方案,例如,如果值是0.1,则为深绿色;如果值是0.1,则深绿色..... 0.9较浅的绿色。同样,如果val为1.1,则为深黄色。如果是1.2,则暗黄色少.............. 1.9浅黄色。像这样的东西
最佳答案
这应该为您工作:
只需将颜色放入一定范围的阵列中即可。然后循环遍历所有颜色,如果$val
在范围内,则将颜色分配给$class
并中断循环。
<?php
$arr = [
"green" => ["start" => 0, "end" => 1],
"yellow" => ["start" => 1, "end" => 3],
"orange" => ["start" => 3, "end" => 5],
"red" => ["start" => 5, "end" => 6],
];
$class = "default";
foreach($arr as $color => $range) {
if($val <= $range["end"] && $val >= $range["start"]) {
$class = $color;
break;
}
}
?>
编辑:
从更新的代码开始,这应该对您有效:
<?php
$arr = [
["start" => 0, "end" => 0.3, "color" => "#0A3A0A"],
["start" => 0.3, "end" => 0.5, "color" => "#1E4E1E"],
["start" => 0.5, "end" => 1, "color" => "#508050"],
["start" => 1, "end" => 1.4, "color" => "#FFFF0A"],
["start" => 1.4, "end" => 1.8, "color" => "#FFFF1E"],
["start" => 1.8, "end" => 2, "color" => "#FFFF32"],
["start" => 2, "end" => 2.4, "color" => "#FFFF46"],
];
$class = "red";
foreach($arr as $range) {
if($val <= $range["end"] && $val >= $range["start"]) {
$class = $range["color"];
break;
}
}
?>
编辑2:
由于您不希望使用“静态”值,因此该方法适用于您:
<?php
$arr = [
["start" => 0, "end" => 0.8, "colorStart" => "FFE6E6", "colorEnd" => "4C0000", "interval" => ""],
["start" => 0.8, "end" => 1.8, "colorStart" => "C2FFC2", "colorEnd" => "296629", "interval" => ""],
["start" => 1.8, "end" => 2.7, "colorStart" => "C2C2FF", "colorEnd" => "6666FF", "interval" => ""],
];
$arr = array_map(function($v){
$steps = intval((($v["end"] - $v["start"]) * 10));
list($redStart, $greenStart, $blueStart) = array_map("hexdec", str_split($v["colorStart"], 2));
list($redEnd, $greenEnd, $blueEnd) = array_map("hexdec", str_split($v["colorEnd"], 2));
$interval = sprintf("%02d", intval(($redStart - $redEnd) / $steps)) . sprintf("%02d", intval(($greenStart - $greenEnd) / $steps)) . sprintf("%02d", intval(($blueStart - $blueEnd) / $steps));
return array_merge($v, ["interval" => $interval]);
}, $arr);
$val = 1.1;
$class = "FF0000";
foreach($arr as $range) {
if($val < $range["end"] && $val >= $range["start"]) {
$class = "";
$multiplier = intval((($val - $range["start"]) * 10));
list($redAdd, $greenAdd, $blueAdd) = array_map(function($v)use($multiplier){return dechex($v*$multiplier);}, str_split($range["interval"], 2));
list($redStart, $greenStart, $blueStart) = str_split($range["colorStart"], 2);
list($redEnd, $greenEnd, $blueEnd) = str_split($range["colorEnd"], 2);
$colors = ["red", "green", "blue"];
foreach($colors as $color) {
if(hexdec(${$color . "End"}) > hexdec(${$color . "Start"}))
$r = hexdec(${$color . "Start"}) + hexdec(${$color. "Add"});
else
$r = hexdec(${$color . "Start"}) - hexdec(${$color. "Add"});
$class .= sprintf("%02X", ($r >= 0 && $r <= 255 ? $r : ($r<0?0:255)));
}
break;
}
}
echo "<div style='hight:100px;width:200px;background-color:#$class;'>some text</div>";
?>