Cómo calcular Gradient Color

Modelos de color son métodos para asignar numéricamente el espectro de color . Los modelos generalmente consisten en tres o cuatro valores de los componentes , tales como los componentes rojo , verde y azul del modelo de color RGB . Por el bien de la creación de una sensación de profundidad o de otros efectos gráficos , a menudo es deseable utilizar los modelos para crear gradientes de color , que son transiciones suaves entre un color y otro . La creación de gradientes es una cuestión de interpolación matemática entre los componentes del modelo de color . Los cálculos del gradiente puede ser tan sencillo o complejo como quieras. Instrucciones
1

Definir un par de coordenadas correspondientes al inicio y al final de la pendiente . Para un gradiente lineal , los coordina también especificar la dirección de la pendiente, lo que en efecto , sirven como la cabeza y la cola de un vector, que es una cantidad direccional. Para un gradiente radial , la cola del vector corresponde al centro , y la magnitud del vector es igual al radio . Por ejemplo , si desea un gradiente diagonal para llenar un cuadrado cuya coordenada superior izquierda es ( 0 , 0), y la parte inferior derecha es ( 100 , 100) , podrá definir las mismas coordenadas que la cabeza y la cola del vector . Cada línea perpendicular al vector entre la cola y la cabeza cambiará gradualmente de color a partir de ( 0 , 0 ) hasta el color final al ( 100 , 100) .
2

Calcular la magnitud de la vector gradiente con la ecuación M = sqrt ( ( x2 - x1 ) ² + ( Y2 - Y1 ) ² ) , donde ( x1 , y1 ) y ( x2, y2 ) son las coordenadas de la cola y la cabeza , respectivamente . Por ejemplo , M = sqrt ( (100 - 0) + ( 100-0 ) ² ) = 141,4
3

Calcular la distancia a la cola del vector gradiente para cada punto en el . zona. Para obtener un vector radial , la ecuación es D = sqrt ( ( x - x1 ) ² + (y - y1 ) ² ) , donde (x , y) es el par de coordenadas de punto . Para gradientes lineales , la distancia no es la propia cola, pero a la línea que pasa a través de la cola perpendicular al vector . La ecuación es D = ( x * ( x2 - x1 ) - x1 * x2 + x1 ² + y * (y2 - y1 ) - y1 * y2 + y1 ² ) /M. Establecer cualquier distancia menor que 0 a 0, y establecer cualquier distancia mayor que la magnitud de la magnitud . Por ejemplo , la distancia del punto ( 20 , 30 ) es D = ( 20 * 100 + 30 * 100 ) /141,1 = 35,4 . Todos los puntos de la recta perpendicular que pasa por ese punto tienen la misma distancia.
4

Calcular la distancia del punto a la relación de la magnitud con la ecuación R = D /M. Por ejemplo , la relación para el punto ( 20 , 30 ) es R = 35.4/141.4 = 0,25
5

Encuentra cada uno de los componentes de color para el punto con la fórmula Cp = R ( C2 . - C1 ) + C1 , donde C1 y C2 son los componentes correspondientes para el color inicial y final del gradiente . Esta fórmula funciona para cualquier modelo de color , pero cuando se trabaja con componentes cíclicos, tales como el tono del modelo HSL ( Hue modelo Luminosidad Saturación ) , los valores de uso para C1 y C2 de tal manera que C2 menos C1 es menos de la mitad del rango del componente .

por ejemplo , si los colores HSL inicial y final de su gradiente son ( 10 , 93 , 33 ) y ( 355 , 28 , 60 ) , la diferencia menos C2 C1 para la tonalidad es 355-10 = 345 , que es más de la mitad de la gama HSL de 360 grados , por lo que al igual que trabajar con los ángulos de un círculo , añadir 360 grados para encontrar un ángulo equivalente . Vamos C1 = 360 + 10 = 370. Por lo tanto el componente de matiz es Cp = 0,25 * ( 355-370 ) + 370 = 366,3 . Eso está fuera del rango , por lo que restar 360 por un valor de 6,3 . Los otros componentes HSL no son cíclicos , por lo que los cálculos son más directos . Para la saturación , Cp = 0,25 * ( 28 a 93 ) + 93 = 76,8 , y para la ligereza , Cp = 0,25 * (60 - 33) + 33 = 40,0 . Redondear todos los cálculos para un color HSL final ( 6 , 77, 40 ) .