IslaVisual
Ultima revisión 05/11/2012
SVG Filters: Uso de feOffset (Compensaciones)
Esta primitiva se utiliza para mover un elemento o pedazo de imagen, típicamente la referenciada por SourceGraphic o BackgroundImage, alrededor del lienzo o tapiz dentro de un filtro con propósitos de la realineación.
Es importante si queremos producir sombras paralelas.
<svg width="200" height="200" viewBox="0 0 200 200" version="1.1" xmlns="http://www.w3.org/2000/svg">
<filter id="offset" x="0" y="0" height="100%" width="100%">
<feGaussianBlur stdDeviation="3"/>
<feOffset dx="0" dy="15" result="B">
<animate attributeName="dx" dur="1s" values="0;10;0" repeatCount="indefinite"/>
<animate attributeName="dy" dur="1s" values="0;10;0" repeatCount="indefinite"/>
</feOffset>
<feMerge><feMergeNode in="B"/><feMergeNode in="SourceGraphic"/></feMerge>
</filter>
<image x="0" y="0" xlink:href="../../img/svg-filters/guitar.png" height="100%" width="100%" filter="url(#offset)" />
</svg>
Los atributos configurables son:
| Atributo | Definición |
|---|---|
| La cantidad a compensar para la entrada de gráficos a lo largo del eje X. La cantidad de desplazamiento se expresa en el sistema de coordenadas establecido por primitiveUnits de el elemento filtro. Su valor por defecto es 0. | |
| La cantidad a compensar para la entrada de gráficos a lo largo del eje Y. La cantidad de desplazamiento se expresa en el sistema de coordenadas establecido por primitiveUnits de el elemento filtro. Su valor por defecto es 0. |
