Subject: Using SVG Filters
by
HIRTZLER Michel
Pilat Informatique Educative
Au Bourg
42520 SAINT-APPOLINARD
FRANCE
Phone/Fax (33) 04 74 87 33 47
Email pilat@wanadoo.fr
Site http://pilat.free.fr
I will show small tools and examples about some SVG filters.
With tools using SVG and javascript, user can modify all parameters for filters and see result.
1°) Filters to modify colors of a picture:
a) feColorMatrix:
Tool: value of matrix is show for any type, you can also change each term of
matrix.
Example: effect is show on JPEG or SVG picture
b) feComponentTransfer:
Tool: you can modify each filter primitive for each type.
Example: effect is show on JPEG or SVG picture.
using animate to create to fade-in out between two JPEG pictures
2°) Lightning a picture:
feSpecularLightning using feSpotLight:
Tool: you can change parameters for feSpecularLightning, feSpotLight and
feComposite ( to merge picture and lightning )
Example: move with mouse lightning on a JPEG picture.
lightning on a cube in 3D with 3 filters one for each face creating pattern to
fill faces.
3°) Create texture:
feTurbulence:
Tool: you can change parameters and type to see texture
Example: animation modify texture
All that is ready and online
4°) Projects that I will add if I have time before may:
a) feDiffuseLightning to compare with feSpecularLightning
b) feConvolveMatrix and animate to effect