[Webkit-unassigned] [Bug 77719] SVG Pattern doesn't consider viewport transform for image size

[bugzilla-daemon at webkit.org]

https://bugs.webkit.org/show_bug.cgi?id=77719





--- Comment #2 from Dirk Schulze <krit at webkit.org>  2012-02-03 19:29:55 PST ---
The culprit is SVGImageBufferTools::calculateTransformationToOutermostSVGCoordinateSystem. But the description is longer:

We try to create pattern tiles in the screen coordinate space to avoid pixelation. Therefor we take the RenderObject of the element where we want to apply the pattern. After that we walk up the DOM Tree (render tree in reality) and consider all transformations on the road. That is done by applying all transformations (including the viewBox and transform of the pattern) to a intermediate transform. We use this transform to map the drawing rect of the tile and get the size that a tile would need on the screen.

This works almost all the time, almost. The attached example is different, since the patterns and the referenced object are in different viewports:

<svg    xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="500" height="500" >

<defs>
<pattern  id="P2" patternUnits="userSpaceOnUse" width="100%" height="100%">
  <rect width="100%" height="100%" fill="url(#P1)"/>
</pattern>

<pattern  id="P1" patternUnits="userSpaceOnUse" width="20" height="20">
  <circle id="S1" r="10" cx="10" cy="10" stroke="black" fill="pink" stroke-width="2" />
</pattern>
</defs>

<svg viewBox="0 0 100 100" preserveAspectRatio="none">
  <rect fill="url(#P2)" width="100%" height="100%"/>
</svg>
</svg>

The last rect in the example above is what we see on the screen. This rect gets filled with pattern P2.

P2 wants to get the tile size of the pattern. Therefor we take the object (the rect), and apply all transforms on the way up to the root. That means, we create a new AffineTransform, apply the transform of the rect (still identity matrix). After that we walk up the DOM and reach the inner SVG element. We apply the viewBox (similar to a transform) and walk up the DOM. We reach the root element and apply the transform of the root element.

For P2 we get the correct size of the tile. But the rect in pattern P2 uses a pattern P1 as well. The new pattern will take this rect to calculate the transform. The problem is, that this rect is not in the viewport of the target element. Therefor we don't apply the transform of the inner SVG on the way up of the DOM.

This ends up in the pixelation. We still need to consider the rect in the pattern, it's transform as well as the transform of the pattern. Afterwards we need the transform of the rect element, the transform of the inner SVG and at the end the root transform.

-- 
Configure bugmail: https://bugs.webkit.org/userprefs.cgi?tab=email
------- You are receiving this mail because: -------
You are the assignee for the bug.