Código de colores basada en el número

Question

Quiero mostrar un color entre rojo, amarillo, verde, dependiendo de un número entre 1 y 100.

1 ser verde y 100 ser rojo, 50 siendo de color amarillo. Quiero básicamente crear un gradiente entre eso.

Hasta ahora, he intentado:

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

Y es un poco lo hace, pero me da parduscos & colores oscuros, sin & amarilla en todo.

Answer 1

Es porque no se debe cambiar dos canales a la vez, pero aumentará R en la primera mitad y baja G en la segunda.

Prueba una función como esta:

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"; 
} 

para probarlo:

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

Answer 2

He encontrado que ocuparse del HSV color model es más fácil que el RGB model. Le ayuda a elegir fácilmente el color con el que desea trabajar; con RGB necesitarás entender cómo se combinarán los diferentes valores de R, G y B para darte el color que quieres/no quieres.

Además, este SO pregunta podría ser útil: How can I cycle through hex color codes in PHP?

Answer 3

No sé de un modelo matemático para una "curva de color" que pasa a través de los valores de color RGB especificados (por ejemplo, lo que usted describe como verde/amarillo/rojo), lo que le permitiría calcular cualquier color intermedio en esa curva. En cualquier caso, un modelo de una función (que es lo que sería) es tan bueno como los puntos de datos que necesita para ajustarse, por lo que debe ser mucho más específico que el verde/amarillo/rojo para obtener resultados decentes incluso si alguien señala las matemáticas.

Recuerda que no estamos interesados ​​en matemática interpolación aquí, sino más bien en "interpolación de color en el espacio" (un término que acabo de componer) - en otras palabras, lo que se vería como un "natural" interpolación a un humano.

Una solución más fácil para aquellos de nosotros que no tenemos el conocimiento de la teoría del color necesario, y que sugeriría, es preseleccionar una serie de colores con una herramienta de selección de color, dividir el rango 0-100 en tantas bandas como los colores que eligió, y use la división de enteros simple para proyectar de 0-100 a una banda de color.

Alimento para la reflexión: De hecho, ¿cómo decide SO el color del recuento de votos positivos para comentarios?

Actualización: Acabo de asked lo anterior en meta. Veamos ...

Answer 4

Después de un poco de mirar, ninguna de las soluciones parecía agradable. Como se indicó anteriormente, HSV es probablemente el camino a seguir, ya que los navegadores modernos pueden dar color con él sin problemas.

para obtener una buena idea de los colores con los que trabaja, echa un vistazo a esta rueda de color:

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

Quiero empezar con el azul, así que utilice 255 para la normalización.

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; 
}