Introduction
In SVG filters, there are many different parameters and it's not always easy to understand function of each.
Drawing tools using SVG allow only some combination of filters and some variations.
To illustrate W3C specifications, I create tools to show effect of each parameter.
Using this tools, I collect various examples, and some give interesting animations
Tools
With this tools using SVG, ECMA/Javascript and PHP user can:
- choose one or two pictures on local disk ( PNG, JPEG or SVG file ) for filters using in and in2 attributes
- modify all parameters for filters and see effect obtained
- save as SVG file the drawing ( using PHP to return file )
This tools treat all SVG filters primitives, alone or in combination
Using filter primitive alone: feColorMatrix, feComponentTransfer, feTurbulence, feMerge, feBlend, feComposite, feGaussianBlur, feMorphology, feConvolveMatrix, feDisplacementMap, feTile.
Filter primitives feSpecularLighting and feDiffuseLighting ( with feSpotLight, feDistantLight or fePointLight as lighting source ) are used with feComposite to create lighted drawing.
Filter primitives feImage, feFlood and feOffset are used to create input for other filters.
Some combination are predefined:
feTurbulence with feColorMatrix or feComponentTransfer to create patterns as clouds.
feTurbulence with feComposite to create grain on picture.
feGaussianBlur, feOffset, feSpecularLighting and feComposite to create 3D ligth effect
|