w3.unpo<code>todo

feComponentTransfer

El elemento <feComponentTransfer> permite modificar cada componente RGBA (R – rojo, G – verde, B – azul, A – alfa ) de cada pixel. Dentro del elemento <feComponentTransfer> aparecen anidados los elementos:

            <feFuncR> - define la función de transferencia para el rojo
            <feFuncG> - define la función de transferencia para el verde
            <feFuncB> - define la función de transferencia para el azul
            <feFuncA> - define la función de transferencia para el componente alfa

La presencia de todos estos elementos no es obligatoria.

En todos estos sub-elementos aparece el atributo type que define el tipo de función de transferencia aplicada. El atributo type puede tomar como valor una de estas palabras clave:

type = "identity | table | discrete | linear | gamma"

identity

Si type="identity" el componente RGBA queda sin modificar.

linear

Si type = "linear" el nuevo valor del componente RGBA

 C = slope * c + intercept

Donde:
slope es el valor del atributo slope ( slope = pendiente ). Si el atributo slope no esta especificado su valor se considera 1.
c es el valor inicial del componente RGBA
intercept es el valor del atributo intercept. Si el atributo intercept no esta especificado su valor se considera 0.

A continuación dos ejemplos: a la izquierda slope="0.5", y la imagen aparece oscurecida. A la derecha slope="1.5", y la imagen aparece más clara, como iluminada.

En el siguiente ejemplo la imagen aparece iluminada y con tonos rojizos, ya que en el caso del componente rojo slope = "3".

Recordemos la fórmula que utilizamos para calcular el componente RGBA modificado:

 C = slope * c + intercept

Donde slope es el valor del atributo slope, c es el valor inicial del componente RGBA y intercept es el valor del atributo intercept.

En el siguiente ejemplo como que intercept tiene valores negativos algunas zonas aparecen muy oscurecidas incluso negras ( si C == 0 ).

table

El atributo type="table" permite dividir los valores de cada componente de color en una serie de intervalos iguales, y redimensionar cada intervalo en parte.

Si el atributo type="table" tenemos que especificar también el atributo tableValues: una lista con los valores modificados de cada intervalo. Los valores aparecen separados por un espacio o una coma.

En el siguiente ejemplo el atributo tavleValues de <feFuncB> es una lista de 5 valores:

tableValues= "0, 0.1, 0.7, 0.9, 1"

lo que quiere decir que el filtro divide los valores iniciales del azul en cinco intervalos iguales, y los cambia por los valores modificados según detallamos en la siguiente tabla:

Podemos invertir una imagen utilizando type="table" y tableValues="1 0".

Si manipulamos solo el componente alfa de una imagen ( <feFuncA> ) obtenemos una imagen semitransparente ( en el siguiente ejemplo 50% opacidad )

discrete

Si el atributo type="discrete" tenemos que especificar también el atributo tableValues: una lista con los valores modificados de cada intervalo. Los valores aparecen separados por un espacio o una coma.

tableValues="0 0.2 0.6 0.8 1"

En el siguiente ejemplo exactamente como en el caso de type="table" el filtro divide los valores iniciales del color en cinco intervalos iguales, solo que esta vez los cambia por un único valor. En consecuencia la imagen aparece posterizada.

gamma

Podemos aplicar una corrección gamma del color, utilizando type="gamma". Si type = "gamma" el filtro calcula el nuevo valor del componente RGBA: C utilizando esta fórmula:

C = amplitude * c^exponent + offset

Donde:
amplitude es el valor del atributo amplitude . Si el atributo amplitude no esta especificado su valor se considera 1.
c es el valor inicial del componente RGBA
exponent ( exponent = potencia ) es el valor del atributo exponent. Si el atributo exponent no esta especificado su valor se considera 1.
offset es el valor del atributo offset. Si el atributo offset no esta especificado su valor se considera 0.