RE: SVG 2 rendering model

On a related note, I saw this fragment in the section that you posted:

As per SVG, the application of 'filter<http://dvcs.w3.org/hg/FXTF/raw-file/tip/filters/index.html#filter>' has no effect on hit-testing."

That seems wrong to me, since it would be possible to have a filter that apply varying opacity.  If the case where an object is completely transparent, then the "hit" should go through that aspect of the object.  Consider the center of a "donut" shape (which, for some reason, used opacity instead of clipping or EOFill or multiple paths) - you would want to return the hit on the object behind the center and not the donut.

Leonard

From: Nikos Andronikos [mailto:nikos.andronikos@cisra.canon.com.au]
Sent: Friday, August 03, 2012 12:54 AM
To: Leonard Rosenthol
Cc: Rik Cabanier; public-svg-wg@w3.org
Subject: Re: SVG 2 rendering model

On 3/08/2012 6:08 AM, Leonard Rosenthol wrote:

On 8/2/12 3:34 PM, "Rik Cabanier" <cabanier@adobe.com><mailto:cabanier@adobe.com> wrote:



Hi Leonard,



The problem with making isolated the default is that it will impact

performance for all of the normal cases.

Isolated is faster since you don't have to composite all the group to get

the background.



But you DO have to create an "offscreen buffer", composite the entire

group into that, and then blit the entire "offscreen" back.   So you're

clearly using more memory and time than simply putting bits into the

existing buffer.





The compositing spec specifies the order in which filters and compositing

happens.

The filters spec should say if the stacking group it creates is isolated

or not. I believe people don't want it to be isolated (and can post some

examples if needed)



But how would you apply a filter to a group that has already been blended

into the background?  The result is certainly going to be different -

which may be good or bad.



I would think that given a group with a filter applied to it, you have to

make that specific group isolated, apply the filter, and only then blend

it to the background.
Exactly, and in the default case the output would be different between SVG 1.1 and SVG 2, which I consider bad.

Filter effects currently relies on the SVG 1.1 compositing model

>From http://dvcs.w3.org/hg/FXTF/raw-file/tip/filters/index.html:
"The compositing model follows the SVG compositing model<http://www.w3.org/TR/SVG11/render.html#Introduction> [SVG11]<http://dvcs.w3.org/hg/FXTF/raw-file/tip/filters/index.html#SVG11>: first any filter effect is applied, then any clipping, masking and opacity. These effects all apply after any other CSS effects such as 'border'. As per SVG, the application of 'filter<http://dvcs.w3.org/hg/FXTF/raw-file/tip/filters/index.html#filter>' has no effect on hit-testing."
Note: for groups, that means first composite the contents of the group together, then apply any filter effect, then clipping, masking and group opacity.

That was fine when you could composite the elements within the group in isolation, as was the case with SVG 1.1
But the default in the new model is isolated=false.

With isolated = false, you cannot composite the group contents together, apply the filter effects and then composite the result with the document. If you do and you are using a combination of operator and blend mode that is not group invariant you will get the wrong output.

I've attached an SVG file which demonstrates the output under each rendering model.

-----------------------------------------------------
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
  "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"<http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd>>
<svg viewBox="0 0 1350 540" xmlns="http://www.w3.org/2000/svg"<http://www.w3.org/2000/svg> version="1.1">

  <defs>
    <filter id="ShiftBGAndBlur" filterUnits="userSpaceOnUse" x="0" y="0" width="1200" height="400">
      <feOffset in="SourceGraphic" dx="0" dy="125" />
      <feGaussianBlur stdDeviation="8" />
    </filter>
  </defs>

  <text>SVG 1.1</text>
  <text x="280">SVG 2</text>
  <g transform="translate(0, 20)">

  <g transform="translate(0,0)" enable-background="new">
    <text>Firstly the contents of the group are composited together</text>
    <desc>Firstly the contents of the group are rendered into a transparent black buffer B</desc>
    <g>
      <circle cx="125" cy="75" r="45" fill="green" opacity=".5" />
      <polygon points="160,25 160,125 240,75" fill="blue" opacity=".5" />
    </g>
    <rect x="5" y="5" width="260" height="260" fill="none" stroke="blue"/>
  </g>

  <g transform="translate(0,280)" enable-background="new">
    <text>Then the filter effect is applied to the composite</text>
    <desc>Then the filter effect is applied to the buffer B</desc>
    <g>
        <g filter="url(#ShiftBGAndBlur)">
          <circle cx="125" cy="75" r="45" fill="green" opacity=".5"/>
          <polygon points="160,25 160,125 240,75" fill="blue" opacity=".5"/>
        </g>
    </g>
    <rect x="5" y="5" width="260" height="260" fill="none" stroke="blue"/>
  </g>

  <g transform="translate(0,560)" enable-background="new">
    <text>then the result of the filter effect is composited onto the page</text>
    <desc>then the buffer B is composited onto the output</desc>
    <g>
        <rect x="25" y="25" width="100" height="100" fill="red"/>
        <g filter="url(#ShiftBGAndBlur)">
          <circle cx="125" cy="75" r="45" fill="green" opacity=".5" />
          <polygon points="160,25 160,125 240,75" fill="blue" opacity=".5" />
        </g>
    </g>
    <rect x="5" y="5" width="260" height="260" fill="none" stroke="blue"/>
  </g>

  <clipPath id="cliptoself_clip">
    <circle cx="125" cy="75" r="45"/>
  </clipPath>

  <g transform="translate(270,0)" enable-background="new">
    <desc>In SVG 2, the contents of the group are rendered into a buffer B2 initialised with the group backdrop. Note clip to self behaviour.</desc>
    <g>
        <rect x="25" y="25" width="100" height="100" fill="red" clip-path="url(#cliptoself_clip)"/>
        <g>
          <circle cx="125" cy="75" r="45" fill="green" opacity=".5"/>
          <polygon points="160,25 160,125 240,75" fill="blue" opacity=".5"/>
        </g>
    </g>
    <rect x="5" y="5" width="260" height="260" fill="none" stroke="blue"/>
  </g>

  <g transform="translate(270,280)" enable-background="new">
    <desc>Then the filter effect is applied to the buffer B2</desc>
    <g filter="url(#ShiftBGAndBlur)">
        <rect x="25" y="25" width="100" height="100" fill="red" clip-path="url(#cliptoself_clip)"/>
        <g>
          <circle cx="125" cy="75" r="45" fill="green" opacity=".5"/>
          <polygon points="160,25 160,125 240,75" fill="blue" opacity=".5"/>
        </g>
    </g>
    <rect x="5" y="5" width="260" height="260" fill="none" stroke="blue"/>
  </g>

  <g transform="translate(270,560)" enable-background="new">
    <desc>then the buffer B2 is composited onto the output - what's wrong with this picture?</desc>
    <rect x="25" y="25" width="100" height="100" fill="red"/>
    <g filter="url(#ShiftBGAndBlur)">
        <rect x="25" y="25" width="100" height="100" fill="red" clip-path="url(#cliptoself_clip)"/>
        <g>
          <circle cx="125" cy="75" r="45" fill="green" opacity=".5"/>
          <polygon points="160,25 160,125 240,75" fill="blue" opacity=".5"/>
        </g>
    </g>
    <rect x="5" y="5" width="260" height="260" fill="none" stroke="blue"/>
  </g>
  </g>

</svg>
The information contained in this email message and any attachments may be confidential and may also be the subject to legal professional privilege. If you are not the intended recipient, any use, interference with, disclosure or copying of this material is unauthorised and prohibited. If you have received this email in error, please immediately advise the sender by return email and delete the information from your system.