Examples Using SVG Filters
In this section, I can only hope to give you a flavor of what is possible with SVG filters. However, I think that I’ve provided enough to whet your appetite to spend time experimenting with them. Certainly, some impressive visual effects are possible.
Gaussian Blur
The <feGaussianBlur> filter primitive defines in Listing 7.8 a generic filter you can use. In the first <use> element, you adjust the opacity of the Gaussian blur to 0.4:
Listing 7.8. (SimpleShadow.svg)
<?xml version="1.0" standalone="no"?> <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.0//EN" "http://www.w3.org/TR/2001/PR-SVG-20010719/ DTD/svg10.dtd"> <svg width="500" height="300"> <defs> <filter id="MyGaussianFilter"> <feGaussianBlur stdDeviation="1.5"/> </filter> ... |
Get Designing SVG Web Graphics now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.
