Bug 125289 - SVG Patterns and Masks in SVG images don't take screen resolution into account
Summary: SVG Patterns and Masks in SVG images don't take screen resolution into account
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: SVG (show other bugs)
Version: 528+ (Nightly build)
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Nobody
URL: http://dev.w3.org/fxtf/css-masking-1/...
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2013-12-05 01:08 PST by Dirk Schulze
Modified: 2024-02-19 11:03 PST (History)
6 users (show)

See Also:


Attachments

Note You need to log in before you can comment on or make changes to this bug.
Description Dirk Schulze 2013-12-05 01:08:42 PST
It seems like we do not take the real screen pixel density into account when we create image buffers for SVG patterns.

In the example image at http://dev.w3.org/fxtf/css-masking-1/#the-mask-repeat, the background circles are pixelated on a retina display, while the white/black circle in the foreground isn't.
Comment 1 Dirk Schulze 2013-12-05 01:11:38 PST
We identified this problem with SVG Filters first, but it affects all situations where we buffer the rendered content:

* SVG filters
* SVG Masks
* SVG clip-path (in some situations)
* SVG Patters
Comment 2 Tim Horton 2013-12-05 10:17:21 PST
Hmm, I fixed this for the traditional case, but it must not be plumbed through to SVG-as-image. Possibly because the fake Page that we make for SVGImage doesn't know about the deviceScaleFactor of the parent Page/etc.?
Comment 3 Tim Horton 2013-12-05 10:28:59 PST
(In reply to comment #2)
> Hmm, I fixed this for the traditional case, but it must not be plumbed through to SVG-as-image. Possibly because the fake Page that we make for SVGImage doesn't know about the deviceScaleFactor of the parent Page/etc.?

And indeed, you'll notice that if you go directly to http://dev.w3.org/fxtf/css-masking-1/images/mask-repeat.svg, it is sharp on a retina display.
Comment 4 Radar WebKit Bug Importer 2014-05-13 00:11:36 PDT
<rdar://problem/16895584>
Comment 5 Dirk Schulze 2014-05-13 22:57:20 PDT
(In reply to comment #3)
> (In reply to comment #2)
> > Hmm, I fixed this for the traditional case, but it must not be plumbed through to SVG-as-image. Possibly because the fake Page that we make for SVGImage doesn't know about the deviceScaleFactor of the parent Page/etc.?
> 
> And indeed, you'll notice that if you go directly to http://dev.w3.org/fxtf/css-masking-1/images/mask-repeat.svg, it is sharp on a retina display.

I just tried to set the device pixel ratio to the page created with SVGImage (hard coded). The image looks indeed better initially. If you zoom in the page, CMD +, the pattern is slightly blurry again Nst much but if you look closer noticeable.

The real problem is that the image seems to get gigantic in memory size as more you zoom in causing the browser to crash at zoom level 200%.

Everything tested with the CSS Masking document. So simply setting the devicePixelRatio seems to be wrong.
Comment 6 Tim Horton 2014-05-13 23:08:20 PDT
(In reply to comment #5)
> (In reply to comment #3)
> > (In reply to comment #2)
> > > Hmm, I fixed this for the traditional case, but it must not be plumbed through to SVG-as-image. Possibly because the fake Page that we make for SVGImage doesn't know about the deviceScaleFactor of the parent Page/etc.?
> > 
> > And indeed, you'll notice that if you go directly to http://dev.w3.org/fxtf/css-masking-1/images/mask-repeat.svg, it is sharp on a retina display.
> 
> I just tried to set the device pixel ratio to the page created with SVGImage (hard coded). The image looks indeed better initially. If you zoom in the page, CMD +, the pattern is slightly blurry again Nst much but if you look closer noticeable.
> 
> The real problem is that the image seems to get gigantic in memory size as more you zoom in causing the browser to crash at zoom level 200%.
> 
> Everything tested with the CSS Masking document. So simply setting the devicePixelRatio seems to be wrong.

Setting devicePixelRatio is not enough to fix page scale or page zoom, you have to multiply those in too :D

And the other part sounds like we draw more than the visible part of the image?