SVG image isn't correctly scaled when only one of the dimension is increased
Categories
(Core :: Graphics: Canvas2D, defect)
Tracking
()
Tracking | Status | |
---|---|---|
firefox118 | --- | affected |
People
(Reporter: calixte, Unassigned)
References
Details
Attachments
(1 file)
(deleted),
text/html
|
Details |
For the context, in pdf.js, we added the ability to add images in a pdf and especially svg ones but they aren't rescaled correctly.
In the attached test case, the canvas where the image is drawn has the same width as the image but its height is 10 times the image one.
The image isn't rescaled at all, it looks like the min of the two scale factors is taken.
In Chrome, it works as expected.
Updated•1 year ago
|
Updated•1 year ago
|
Comment 1•1 year ago
|
||
I could be wrong, but I think this might be a case that hasn't been spec'ed yet and browsers disagree
https://bugzilla.mozilla.org/show_bug.cgi?id=700533#c69
For comparison purposes, if one instead puts the svg into an img element with the same dimensions as the canvas then all browsers have the non-stretched rendering that Firefox has in the canvas.
To understand what is happening in the img case, svg files with a viewbox by default have preserveAspectRatio="xMidYMid meet". This means that when drawing the svg into a viewport with a different aspect ratio than the viewbox we are to keep the aspect ratio of the viewbox and not stretch.
Comment 2•1 year ago
|
||
https://bugzilla.mozilla.org/show_bug.cgi?id=1547776#c3 suggests a potential way to get the rendering you seek.
Reporter | ||
Comment 3•1 year ago
|
||
:tnikkel, thank you for the tip it's useful.
Comment 4•1 year ago
|
||
The severity field is not set for this bug.
:lsalzman, could you have a look please?
For more information, please visit BugBot documentation.
Updated•1 year ago
|
Description
•