Giters

typst / svg2pdf

Converts SVG files to PDF.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Weird behavior when embedding image in SVG and specifying width/height in a unit other than px

LaurenzV opened this issue · comments

commented

I wanted to do some digging into this issue, and at least one part of the problem can be reduced to the following weird behavior:

The first thing I did is to create a 50px x 50px image of a yellow rectangle and I tried to generate two different SVGs:

Version 1

I first tried the following SVG.

Input:

<svg xmlns:xlink="http://www.w3.org/1999/xlink" width="100" height="100" viewBox="0 0 100 100"
     xmlns="http://www.w3.org/2000/svg" version="1.1">
    <image xlink:href="data:image/png;base64,
iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAQ0lEQVR42u3PQREAAAgDINc/9Mzg14MGpJ3OAxERERERERERERERERERERERERERERERERERERERERERERERERERuVjg6JWdCD2ogQAAAABJRU5ErkJggg=="
           id="image7eea7a0a44"/>
</svg>

which correctly is outputted as the following:

Output:
image

Version 2

Now comes the weird thing though, if I specify the width and height of the SVG itself in pt but leave the view box unchanged, I get the following result.

Input:

<svg xmlns:xlink="http://www.w3.org/1999/xlink" width="100pt" height="100pt" viewBox="0 0 100 100"
     xmlns="http://www.w3.org/2000/svg" version="1.1">
    <image xlink:href="data:image/png;base64,
iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAQ0lEQVR42u3PQREAAAgDINc/9Mzg14MGpJ3OAxERERERERERERERERERERERERERERERERERERERERERERERERERuVjg6JWdCD2ogQAAAABJRU5ErkJggg=="
           id="image7eea7a0a44"/>
</svg>

Output:
image

So for some reason, the image is shifted down a bit and it's a bit too small. If I render the same svg in resvg, it looks like in Version 1.

I'll try to figure out what's going on, but I thought I'd post this anyways in case someone already knows what might be the problem here.

commented

Will be fixed with #34.