Fixes for downloading PNG #84
Conversation
|
Hi, thanks for the PR and sorry for the long radio silence! |
|
Hi @cy6erskunk, apologies for my own long radio silence! I'm finding it hard to set up a simple test case for the first point, and I need to do a little more experimentation on my side to see whether it's just an issue with our own implementation. In the meantime, can I break out the device pixel ratio change as a separate, standalone PR? I imagine this would be an easier merge to make and shouldn't be blocked while I work on the first point. Thanks! |
| @@ -38,8 +38,8 @@ function getSource(svg) { | |||
| const result = { | |||
| top: rect.top, | |||
| left: rect.left, | |||
| width: rect.width, | |||
| height: rect.height, | |||
| width: svg.width.baseVal.value, | |||
There was a problem hiding this comment.
Apparently, it's a bit more complicated than I thought. Chrome and Firefox approach this value a bit differently. I'm trying to set up some tests as it feels that solution gonna be a bit more complicated.
There was a problem hiding this comment.
Yes, agreed. I do have a bit of time to help investigate this in the next few weeks, but that's also why I'm proposing that I break out commit 432f198 into a separate PR, since it's a different issue. What do you think?
|
@cy6erskunk I'm putting an example for the first case in the original issue (#75). |
louh
force-pushed
the
louh/png-fixes
branch
2 times, most recently
from
987825e to
0237aa1
Compare
Hi there,
I'd like to open my PR to further the discussion on #75. This fixes two big issues for us:
If the DOM containing element has a variable width and height, and it contains an
<svg>element with aviewBoxproperty, then the resulting downloaded PNG will render the SVG at its ownviewBoxdimensions, which will mismatch from the DOM dimensions. This proposal renders the resulting PNG at the source SVG'sviewBoxdimensions.If the user downloads a PNG from a monitor with a high pixel density (such as a Macbook with a Retina screen) then the resulting PNG will be pixelated. This PR renders the resulting PNG at the same pixel density as the user's monitor.
There is a broken test because reading
baseValfrom an empty SVG throws an error. This might take time to fix, so I'd like to open this for further conversation so I can decide how to approach this. Thanks!