Implement remaining filter primitives
- [x] feComponentTransfer
- feFuncA
- feFuncB
- feFuncG
- feFuncR
- [ ] feConvolveMatrix
- [ ] feDiffuseLighting
- [x] feDropShadow
- [ ] feDistantLight
- [ ] feImage
- [ ] feMorphology
- [ ] fePointLight
- [ ] feSpecularLighting
- [ ] feSpotLight
- [ ] feTile
feTile and feImage first require proper handling of filter primitive regions #70.
I think <feDropShadow> would be a nice addition, as it is a convenient shorthand for commonly used effect. Possibly implemented as translation to existing primitives, as suggested by the spec.
For <feImage> there's the (separate) use case of using SVG fragment as a source: <feImage href="#graphic1" />. It doesn't appear supported by Firefox currently (Bug #455986), but it is handled in Chrome. While there are alternative (more complex) ways to achieve the following, here's an example I would like to share – Have an object cast a shadow only over another one:
filter-mask.svg
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256">
<defs>
<filter id="shadow-on-graphic1" x="0" y="0" width="100%" height="100%" filterUnits="userSpaceOnUse">
<feGaussianBlur in="SourceAlpha" stdDeviation="5" />
<feOffset dx="5" dy="10" result="offset-blur" />
<feImage href="#graphic1" result="graphic1" />
<feFlood flood-color="black" flood-opacity="0.5" />
<feComposite in2="offset-blur" operator="in" />
<feComposite in2="graphic1" operator="in" result="masked-shadow" />
<feComposite in="SourceGraphic" in2="masked-shadow" operator="over" />
</filter>
</defs>
<rect id="graphic1" x="13" y="13" width="120" height="230" fill="green" />
<circle cx="110" cy="130" r="70" fill="orange" filter="url(#shadow-on-graphic1)" />
</svg>
Reference image from Batik (after translating href → xlink:href):
It is more likely that I find time to implement feDropShadow. feImage isn't implemented yet due to #70 and layout being rather complicated (preserveAspectRatio makes this messy at the moment).
feDropShadow is now implemented in the current snapshot.
Verified with current 1.5.1-SNAPSHOT – feDropShadow is supported.