SVG filters may shift and blur elements in embedded image

UNCONFIRMED
Unassigned

Status

()

UNCONFIRMED
6 years ago
7 months ago

People

(Reporter: blambov, Unassigned)

Tracking

Trunk
x86_64
Linux
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

MozReview Requests

()

Submitter Diff Changes Open Issues Last Updated
Loading...
Error loading review requests:

Attachments

(5 attachments)

(Reporter)

Description

6 years ago
Created attachment 726134 [details]
firefox-filter.html

User Agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:19.0) Gecko/20100101 Firefox/19.0
Build ID: 20130307122903

Steps to reproduce:

The attached file contains an embedded SVG element that's not aligned on a pixel boundary. The embedded SVG contains two rectangles, one of which is under a filter that does nothing.


Actual results:

The two rectangles look different: the one under the filter is blurry, and its text is not as readable.


Expected results:

The two rectangles should look the same.
(Reporter)

Comment 1

6 years ago
We're seeing this in many Flash ad conversions, where blur being removed or a shadow being added at the end of a transition results in a visible wobble of portions of the image.

Comment 2

6 years ago
I can confirm the problem of comment#0 .

http://hg.mozilla.org/mozilla-central/rev/b03bb3ce8cee
Mozilla/5.0 (Windows NT 6.1; WOW64; rv:22.0) Gecko/20130318 Firefox/22.0 ID:20130318030947

And the problem existed since Firefox4...
Status: UNCONFIRMED → NEW
Ever confirmed: true
Version: 19 Branch → Trunk
Attachment #726134 - Attachment mime type: text/plain → text/html
From the SVG specification...

http://www.w3.org/TR/SVG/filters.html#feOffsetElement

When applying this filter, the destination location may be offset by a fraction of a pixel in device space. In this case a high quality viewer should make use of appropriate interpolation techniques, for example bilinear or bicubic

Which is pretty much what we do. Makes it fuzzy for you though.

You should be able to modify filterRes to get a result which works better for your use cases.
Status: NEW → RESOLVED
Last Resolved: 6 years ago
Resolution: --- → INVALID
(Reporter)

Comment 4

6 years ago
Created attachment 726197 [details]
Empty feComponentTransfer

This is not feOffset-specific. Any filter will cause it.

I believe the reason is that the buffer created for the image source is snapped to pixel boundaries relative to the SVG origin, while that should have been done relative to the origin of the page.
(Reporter)

Updated

6 years ago
Attachment #726197 - Attachment mime type: text/plain → text/html
Status: RESOLVED → UNCONFIRMED
Ever confirmed: false
Resolution: INVALID → ---
Duplicate of this bug: 814406

Updated

2 years ago
Assignee: nobody → cku
Comment hidden (typo)

Updated

2 years ago
No longer depends on: 1338393
Comment hidden (mozreview-request)

Updated

a year ago
Duplicate of this bug: 772787
Comment hidden (mozreview-request)
Comment hidden (mozreview-request)
Comment hidden (mozreview-request)

Updated

7 months ago
Assignee: cku → nobody
You need to log in before you can comment on or make changes to this bug.