Open Bug 1846565 Opened 1 year ago Updated 1 year ago

SVG image isn't correctly scaled when only one of the dimension is increased

Categories

(Core :: Graphics: Canvas2D, defect)

Firefox 118
defect

Tracking

()

Tracking Status
firefox118 --- affected

People

(Reporter: calixte, Unassigned)

References

Details

Attachments

(1 file)

Attached file plop.html (deleted) —

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.

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.

https://bugzilla.mozilla.org/show_bug.cgi?id=1547776#c3 suggests a potential way to get the rendering you seek.

:tnikkel, thank you for the tip it's useful.

Blocks: 1846727
No longer blocks: 1846099

The severity field is not set for this bug.
:lsalzman, could you have a look please?

For more information, please visit BugBot documentation.

Flags: needinfo?(lsalzman)
Severity: -- → S3
Flags: needinfo?(lsalzman)
No longer blocks: 1846727
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Created:
Updated:
Size: