• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

10. Filters > Accessing the Background

Accessing the Background

In addition to the SourceGraphic and SourceAlpha filter inputs, a filtered object may access the part of the image that has already been rendered onto the canvas when you invoke a filter. These parts are called BackgroundImage (not BackgroundGraphic) and BackgroundAlpha. In order to access these inputs, the filtered object must be within a container element that has set the enable-background attribute to the value new. Example 10-11 performs a Gaussian blur on the background alpha channel.

Example 10-11. Accessing the background
<defs>
<filter id="blur-background">
    <feGaussianBlur in="BackgroundAlpha"     [1]
        stdDeviation="2" result="blur"/>
    <feOffset in="blur" dx="4" dy="4" result="offsetBlur"/>
    <feMerge>
        <feMergeNode in="offsetBlur"/>
        <feMergeNode in="SourceGraphic"/>
    </feMerge>
</filter>
</defs>

<g enable-background="new">     [2]
    <circle cx="30" cy="30" r="30" style="fill: #fff;"/>     [3]
    <rect x="0" y="0" width="60" height="60"
        style="filter: url(#blur-background);      [4]
        fill: none; stroke: blue;" />
</g>

PREVIEW

                                                                          

Not a subscriber?

Start A Free Trial


  
  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint