CairoSVG svg2png: produces always low quality PNG images?

How to produce from an SVG image a PNG image of smaller size but still high resolution? Currently, I can produce smaller size PNGs but the resolution is reduced as well. It seems that scale and output_width/height do the same thing: they change/reduce the size and in doing so also the resolution. The parameter dpi I thought was the answer but it seems not to affect the quality of the PNG. Am I missing something?

Aug 04 '20 17:08 agforte

"smaller size but still high resolution"

It does not make much sense for me. Could you reformulate your question and/or provide examples? PNG is rasterized so smaller size == less resolution.

Aug 04 '20 17:08 aziesemer

Size and resolution are two different things. A 4.5 inch screen can have 1920x1080 resolution or 640x480 resolution. Same an image, can be a 2 meters by 2 meters image with very high resolution (will look great) or with very low resolution (will look pixellated). That's why I thought that the dpi parameter was supposed to give me higher resolution for a given size.

Aug 04 '20 18:08 agforte

Are you setting the size in inches (or something that can be converted to it)? Try setting view box and width/height in your top level svg element.

Aug 04 '20 18:08 aziesemer

Hello!

For some background information about the dpi option and the resolution, you can read this comment.

A PNG file is a table of pixels, its size is in pixels. There’s no resolution set, because there’s no size in real life units (millimeters, points, inches…) set. The dpi option does not set the resolution of the generated PNG, because there’s no resolution set.

You can add EXIF metadata to your PNG to set a real size, and thus a resolution, but that’s probably not what you want. You probably want to increase the number of pixels, and you can do this using the ~--zoom option~. (Edit: it’s the --scale option.)

A 4.5 inch screen can have 1920x1080 resolution or 640x480 resolution.

Just to be clear: "640×480 pixels" is called a "resolution", but it’s actually just a number of pixels. A resolution is actually a pixel density, ie. a number of pixels per unit (per inch, per millimeter…). So, "640×480 pixels on a 4.5 inch screen" is a resolution :smile:.

Aug 05 '20 09:08 liZe

liZe thanks for your comments. Is there any documentation about the --zoom option? I am using the latest version of CairoSVG and I was not aware of such option.

Aug 05 '20 12:08 agforte

Is there any documentation about the --zoom option?

My bad. It’s not --zoom, it’s --scale.

Aug 05 '20 13:08 liZe

Oh yes, I tried --scale. This option increases the number of pixels but also the size of the PNG, unless I have missed something and there is an option to resize the PNG without reducing the amount of pixels.

Currently I can make a PNG of AxB dimensions that looks OK on older screens but looks terrible on newer screens like the ones on the new Macs. I need a way to produce a PNG of fixed dimensions that looks good on both.

I have seen that if I produce a PNG with --scale=2, open it in Preview on my Mac, and then resize the window in Preview (by dragging one of its corners) making the PNG image smaller then I obtain a high resolution PNG of the dimensions that I want. I am not an image expert but I am guessing there has to be a way to produce such a PNG programmatically.

Aug 05 '20 17:08 agforte

there is an option to resize the PNG without reducing the amount of pixels.

The size of the PNG is the amount of pixels. There’s no size in physical units stored in the PNG.

I need a way to produce a PNG of fixed dimensions that looks good on both.

The only way I know to include a size in physical units (millimeters, inches, …) in a PNG is using EXIF metadata. I don’t know if Preview takes care of that.

Do you have a PNG file that shows the desired behavior?

Aug 05 '20 20:08 liZe

Do you have a PNG file that shows the desired behavior?

Yes, please see below.

noname svg scaled1

Aug 06 '20 07:08 agforte

Well… This image has no extra metadata. The only information you can get of it is its size: 606×444 pixels. There’s no EXIF information, there’s no pHYs field to set the resolution. For me, any 606×444 PNG would behave the same way.

Here’s what I get with pngchunks:

Chunk: Data Length 13 (max 2147483647), Type 1380206665 [IHDR]
  Critical, public, PNG 1.2 compliant, unsafe to copy
  IHDR Width: 606
  IHDR Height: 444
  IHDR Bitdepth: 8
  IHDR Colortype: 6
  IHDR Compression: 0
  IHDR Filter: 0
  IHDR Interlace: 0
  IHDR Compression algorithm is Deflate
  IHDR Filter method is type zero (None, Sub, Up, Average, Paeth)
  IHDR Interlacing is disabled
  Chunk CRC: 256224146
Chunk: Data Length 6 (max 2147483647), Type 1145523042 [bKGD]
  Ancillary, public, PNG 1.2 compliant, unsafe to copy
  ... Unknown chunk type
  Chunk CRC: -1598183533
Chunk: Data Length 8192 (max 2147483647), Type 1413563465 [IDAT]
  Critical, public, PNG 1.2 compliant, unsafe to copy
  IDAT contains image data
  Chunk CRC: -401171272
Chunk: Data Length 8192 (max 2147483647), Type 1413563465 [IDAT]
  Critical, public, PNG 1.2 compliant, unsafe to copy
  IDAT contains image data
  Chunk CRC: 330635963
Chunk: Data Length 8192 (max 2147483647), Type 1413563465 [IDAT]
  Critical, public, PNG 1.2 compliant, unsafe to copy
  IDAT contains image data
  Chunk CRC: 1695628244
Chunk: Data Length 8192 (max 2147483647), Type 1413563465 [IDAT]
  Critical, public, PNG 1.2 compliant, unsafe to copy
  IDAT contains image data
  Chunk CRC: -229678130
Chunk: Data Length 8192 (max 2147483647), Type 1413563465 [IDAT]
  Critical, public, PNG 1.2 compliant, unsafe to copy
  IDAT contains image data
  Chunk CRC: 1128154530
Chunk: Data Length 8192 (max 2147483647), Type 1413563465 [IDAT]
  Critical, public, PNG 1.2 compliant, unsafe to copy
  IDAT contains image data
  Chunk CRC: -1562050575
Chunk: Data Length 8192 (max 2147483647), Type 1413563465 [IDAT]
  Critical, public, PNG 1.2 compliant, unsafe to copy
  IDAT contains image data
  Chunk CRC: -1474286445
Chunk: Data Length 3835 (max 2147483647), Type 1413563465 [IDAT]
  Critical, public, PNG 1.2 compliant, unsafe to copy
  IDAT contains image data
  Chunk CRC: -962423188
Chunk: Data Length 0 (max 2147483647), Type 1145980233 [IEND]
  Critical, public, PNG 1.2 compliant, unsafe to copy
  IEND contains no data
  Chunk CRC: -1371381630

bKGD sets the background color, IDAT defines the pixels, IEND is the end of the image. There’s nothing more.

Aug 06 '20 14:08 liZe

Apologies. I may have sent you the wrong image. How about this one?

noname svg scaled1 preview

Aug 06 '20 14:08 agforte

Here are the differences between the first and second image, as given by imagemagick:

< Image: 89505162-dd59ad80-d7d1-11ea-8af3-521e3b116268.png
---
> Image: 89543572-c6cf4880-d809-11ea-8a4a-2b1938ba9551.png
424c424
<   Gamma: 0.454545
---
>   Gamma: 0.45455
443,445c443,446
<     date:create: 2020-08-06T17:03:55+02:00
<     date:modify: 2020-08-06T17:03:55+02:00
<     png:bKGD: chunk was found (see Background color, above)
---
>     date:create: 2020-08-06T16:35:24+02:00
>     date:modify: 2020-08-06T16:35:24+02:00
>     png:cHRM: chunk was found (see Chromaticity, above)
>     png:gAMA: gamma=0.45455 (See Gamma, above)
455c456
<     filename: 89505162-dd59ad80-d7d1-11ea-8af3-521e3b116268.png
---
>     filename: 89543572-c6cf4880-d809-11ea-8a4a-2b1938ba9551.png
458c459
<   Filesize: 61338B
---
>   Filesize: 63637B
459a461
>   Pixels per second: 26.9064MB
461c463
<   Elapsed time: 0:01.000
---
>   Elapsed time: 0:01.010

There’s no real difference.

By the way: there’s nothing CairoSVG can do for you. The best way to get a solution is to ask on image forums why some PNG files behave differently with Preview, and to find a third-party tool that can add the relevant metadata.

Aug 06 '20 15:08 liZe

Thanks for your feedback. The --dpi option is very confusing now, based on the discussion we just had. In particular, in a PNG image where you don't have any physical dimensions, it seems to me that the --dpi option should not do anything, however if I set it, it does affect the image in some way. This seems to mean that somehow CairoSVG has some knowledge of image dimensions also for PNG? Or what is going on?

Aug 09 '20 10:08 agforte

@liZe after inspecting both images using Preview Image Inspector, it turns out that the second image has EXIF data attached to it while the first image does not.

Aug 09 '20 11:08 agforte

@liZe after inspecting the second image using Preview Image Inspector, it turns out that the second image has EXIF data attached to it while the first image does not.

It does, but I can’t see any size information in the EXIF data with all the different tools I’ve used.

Thanks for your feedback. The --dpi option is very confusing now, based on the discussion we just had. In particular, in a PNG image where you don't have any physical dimensions, it seems to me that the --dpi option should not do anything, however if I set it, it does affect the image in some way.

What is different?

Aug 09 '20 11:08 liZe

This is the SVG (screenshot) I want to convert to PNG:

Screen Shot 2020-08-09 at 1 25 01 PM

With a DPI parameter of 96 and below everything looks ok and the PNG looks the same as the SVG. If I set a DPI parameter higher than that then I get this PNG:

noname svg dpi128

Aug 09 '20 11:08 agforte

Please attach the SVG file, I need to see what’s inside to help you.

(I suppose that this SVG mixes inches/millimeters and pixels, that’s all…)

Aug 09 '20 11:08 liZe

Thanks for your help! One more thing. I have specified a DPI of 128 but Preview Image Inspector tells me that the image DPI is 72. Not sure why.

This is the SVG:

<?xml version="1.0" encoding="utf-8" ?>
<svg baseProfile="tiny" height="60.0mm" preserveAspectRatio="xMidYMid meet" version="1.2" viewBox="0,0,750,300" width="105.0mm" xmlns="http://www.w3.org/2000/svg" xmlns:ev="http://www.w3.org/2001/xml-events" xmlns:xlink="http://www.w3.org/1999/xlink">
  <defs/>
  <rect fill="rgb(98%,98%,100%)" fill-opacity="1" height="300" rx="14" ry="14" stroke="rgb(220,220,220)" stroke-opacity="0.2" stroke-width="1" width="750" x="0" y="0"/>
  <g id="marker" stroke="rgb(0%,0%,0%)" stroke-width="1">
    <line x1="3mm" x2="6mm" y1="21mm" y2="21mm"/>
  </g>
  <g id="marker" stroke="rgb(0%,0%,0%)" stroke-width="1">
    <line x1="3mm" x2="3mm" y1="21mm" y2="24mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="10mm" x2="13mm" y1="31mm" y2="28mm"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(64.67999999999999, 110.4) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="22mm" x2="25mm" y1="28mm" y2="31mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="28mm" x2="31mm" y1="28mm" y2="31mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="34mm" x2="37mm" y1="31mm" y2="28mm"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(155.4, 110.4) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(42.0, 133.2) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="16mm" x2="19mm" y1="34mm" y2="37mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="22mm" x2="25mm" y1="37mm" y2="34mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="28mm" x2="31mm" y1="37mm" y2="34mm"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(132.72, 133.2) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="40mm" x2="43mm" y1="34mm" y2="37mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="10mm" x2="13mm" y1="43mm" y2="40mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(64.67999999999999, 156.0) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(87.36, 156.0) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(110.04, 156.0) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(132.72, 156.0) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(155.4, 156.0) rotate(45)"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(42.0, 178.8) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="16mm" x2="19mm" y1="49mm" y2="46mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(87.36, 178.8) rotate(45)"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(110.04, 178.8) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="34mm" x2="37mm" y1="46mm" y2="49mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="40mm" x2="43mm" y1="49mm" y2="46mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(42.0, 201.6) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="16mm" x2="19mm" y1="55mm" y2="52mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="22mm" x2="25mm" y1="55mm" y2="52mm"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(110.04, 201.6) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(132.72, 201.6) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(155.4, 201.6) rotate(45)"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(42.0, 224.4) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="16mm" x2="19mm" y1="61mm" y2="58mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="22mm" x2="25mm" y1="58mm" y2="61mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(110.04, 224.4) rotate(45)"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(132.72, 224.4) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="40mm" x2="43mm" y1="58mm" y2="61mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(178.08, 110.4) rotate(45)"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(200.76, 110.4) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="58mm" x2="61mm" y1="28mm" y2="31mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(246.11999999999998, 110.4) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="70mm" x2="73mm" y1="31mm" y2="28mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="76mm" x2="79mm" y1="31mm" y2="28mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="46mm" x2="49mm" y1="34mm" y2="37mm"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(200.76, 133.2) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="58mm" x2="61mm" y1="34mm" y2="37mm"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(246.11999999999998, 133.2) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="70mm" x2="73mm" y1="37mm" y2="34mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="76mm" x2="79mm" y1="37mm" y2="34mm"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(178.08, 156.0) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="52mm" x2="55mm" y1="43mm" y2="40mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(223.44, 156.0) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="64mm" x2="67mm" y1="43mm" y2="40mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="70mm" x2="73mm" y1="43mm" y2="40mm"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(291.48, 156.0) rotate(-45)"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(178.08, 178.8) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="52mm" x2="55mm" y1="49mm" y2="46mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="58mm" x2="61mm" y1="49mm" y2="46mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(246.11999999999998, 178.8) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="70mm" x2="73mm" y1="46mm" y2="49mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="76mm" x2="79mm" y1="46mm" y2="49mm"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(178.08, 201.6) rotate(-45)"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(200.76, 201.6) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="58mm" x2="61mm" y1="55mm" y2="52mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="64mm" x2="67mm" y1="52mm" y2="55mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="70mm" x2="73mm" y1="52mm" y2="55mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="76mm" x2="79mm" y1="55mm" y2="52mm"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(178.08, 224.4) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="52mm" x2="55mm" y1="61mm" y2="58mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(223.44, 224.4) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="64mm" x2="67mm" y1="58mm" y2="61mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(268.8, 224.4) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="76mm" x2="79mm" y1="61mm" y2="58mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(314.16, 110.4) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(336.84, 110.4) rotate(45)"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(359.52, 110.4) rotate(-45)"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(382.2, 110.4) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="106mm" x2="109mm" y1="28mm" y2="31mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="112mm" x2="115mm" y1="28mm" y2="31mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="82mm" x2="85mm" y1="37mm" y2="34mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="88mm" x2="91mm" y1="34mm" y2="37mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(359.52, 133.2) rotate(45)"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(382.2, 133.2) rotate(-45)"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(404.88, 133.2) rotate(-45)"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(427.56, 133.2) rotate(-45)"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(314.16, 156.0) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(336.84, 156.0) rotate(45)"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(359.52, 156.0) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(382.2, 156.0) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="106mm" x2="109mm" y1="43mm" y2="40mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="112mm" x2="115mm" y1="43mm" y2="40mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(314.16, 178.8) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="88mm" x2="91mm" y1="49mm" y2="46mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="94mm" x2="97mm" y1="49mm" y2="46mm"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(382.2, 178.8) rotate(-45)"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(404.88, 178.8) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="112mm" x2="115mm" y1="46mm" y2="49mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(314.16, 201.6) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="88mm" x2="91mm" y1="52mm" y2="55mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(359.52, 201.6) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="100mm" x2="103mm" y1="52mm" y2="55mm"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(404.88, 201.6) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(427.56, 201.6) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="82mm" x2="85mm" y1="61mm" y2="58mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="88mm" x2="91mm" y1="58mm" y2="61mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="94mm" x2="97mm" y1="61mm" y2="58mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="100mm" x2="103mm" y1="61mm" y2="58mm"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(404.88, 224.4) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="112mm" x2="115mm" y1="61mm" y2="58mm"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(450.23999999999995, 110.4) rotate(-45)"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(472.92, 110.4) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="130mm" x2="133mm" y1="28mm" y2="31mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="136mm" x2="139mm" y1="28mm" y2="31mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="142mm" x2="145mm" y1="28mm" y2="31mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="148mm" x2="151mm" y1="28mm" y2="31mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="118mm" x2="121mm" y1="34mm" y2="37mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(472.92, 133.2) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(495.6, 133.2) rotate(45)"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(518.28, 133.2) rotate(-45)"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(540.96, 133.2) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(563.64, 133.2) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="118mm" x2="121mm" y1="40mm" y2="43mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(472.92, 156.0) rotate(45)"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(495.6, 156.0) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="136mm" x2="139mm" y1="40mm" y2="43mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(540.96, 156.0) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="148mm" x2="151mm" y1="43mm" y2="40mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="118mm" x2="121mm" y1="49mm" y2="46mm"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(472.92, 178.8) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="130mm" x2="133mm" y1="46mm" y2="49mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(518.28, 178.8) rotate(45)"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(540.96, 178.8) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(563.64, 178.8) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="118mm" x2="121mm" y1="52mm" y2="55mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(472.92, 201.6) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(495.6, 201.6) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(518.28, 201.6) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="142mm" x2="145mm" y1="55mm" y2="52mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="148mm" x2="151mm" y1="52mm" y2="55mm"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(450.23999999999995, 224.4) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(472.92, 224.4) rotate(45)"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(495.6, 224.4) rotate(-45)"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(518.28, 224.4) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="142mm" x2="145mm" y1="61mm" y2="58mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(563.64, 224.4) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(586.32, 110.4) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="160mm" x2="163mm" y1="28mm" y2="31mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(631.68, 110.4) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(654.36, 110.4) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="178mm" x2="181mm" y1="31mm" y2="28mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="184mm" x2="187mm" y1="31mm" y2="28mm"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(586.32, 133.2) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="160mm" x2="163mm" y1="37mm" y2="34mm"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(631.68, 133.2) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="172mm" x2="175mm" y1="34mm" y2="37mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(677.04, 133.2) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="184mm" x2="187mm" y1="37mm" y2="34mm"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(586.32, 156.0) rotate(-45)"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(609.0, 156.0) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="166mm" x2="169mm" y1="40mm" y2="43mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="172mm" x2="175mm" y1="40mm" y2="43mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="178mm" x2="181mm" y1="43mm" y2="40mm"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(699.72, 156.0) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="154mm" x2="157mm" y1="46mm" y2="49mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="160mm" x2="163mm" y1="46mm" y2="49mm"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(631.68, 178.8) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="172mm" x2="175mm" y1="46mm" y2="49mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="178mm" x2="181mm" y1="49mm" y2="46mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(699.72, 178.8) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="154mm" x2="157mm" y1="52mm" y2="55mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(609.0, 201.6) rotate(45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="166mm" x2="169mm" y1="55mm" y2="52mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="172mm" x2="175mm" y1="52mm" y2="55mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(677.04, 201.6) rotate(45)"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(699.72, 201.6) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="154mm" x2="157mm" y1="61mm" y2="58mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="160mm" x2="163mm" y1="58mm" y2="61mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="166mm" x2="169mm" y1="58mm" y2="61mm"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="1.5">
    <line x1="172mm" x2="175mm" y1="58mm" y2="61mm"/>
  </g>
  <g id="hellipse" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(677.04, 224.4) rotate(-45)"/>
  </g>
  <g id="hlines" stroke="rgb(0%,0%,0%)" stroke-width="5">
    <ellipse cx="0mm" cy="0mm" rx="1" ry="7" transform="translate(699.72, 224.4) rotate(45)"/>
  </g>
  <g id="logo"/>
  <g id="logo" transform="translate(375.0, 264), rotate(45)">
    <ellipse cx="0" cy="0" fill="rgb(0,0,0)" fill-opacity="0" rx="2.0mm" ry="4.5mm" stroke="black" stroke-width="1.4"/>
  </g>
  <g id="logo" transform="translate(375.0, 264), rotate(-45)">
    <ellipse cx="0" cy="0" fill="rgb(0,0,0)" fill-opacity="0" rx="2.0mm" ry="4.5mm" stroke="black" stroke-width="1.4"/>
  </g>
  <text fill="black" font-family="WenQuanYi Micro Hei Mono, Helvetica" font-size="24" text-anchor="middle" x="375.0" y="64">This is a DPI test</text>
</svg>

Aug 09 '20 11:08 agforte

Thanks for your help! One more thing. I have specified a DPI of 128 but Preview Image Inspector tells me that the image DPI is 72. Not sure why.

Please, forget the dpi option, that’s not what you want for your use case. It doesn’t set the resolution of the output image. It sets the ratio between 1 inch and 1 pixel when rendering the image.

In your document, millimeters are mixed with unitless values. The ratio between these units change with the dpi option, that’s why the positions are modified.

If you want to set the resolution of the PNG, you have to add a size in millimeters/inches in its metadata. CairoSVG doesn’t do that, but you can find other tools (ExifTool for example). I won’t be able to help you about these tools (because I don’t use them), but they’ll probably give you a solution.

Aug 09 '20 13:08 liZe

Hi, I had the same issue since exported image.png likely jpeg compressed . My svg image is back and white pixel but exported png image has some gray pixels:

Apr 02 '23 01:04 hungtooc

Hi, I had the same issue since exported image.png likely jpeg compressed .

Hi!

What you see is not caused by JPEG compression, it caused by anti-aliasing. If you want to avoid it (but you probably don’t), you can use the shape-rendering attribute to crispEdges.

Apr 02 '23 07:04 liZe