Affinity Designer, SVGs, and scaling

Everything Else
3

When I first starting using Affinity Designer with my Glowforge, I was pulling my hair out trying to get things to scale right. Every single SVG I exported would show up the wrong size in the GFUI. It was maddening. So I looked at a lot of SVG files generated by AD and compared them to those from other sources (such as Inkscape) that scale just fine. I noticed that Affinity Designer always sets the width and height parameters of the top svg tag to 100%. All the files that scale properly set these parameters to the actual size of the drawing, either in dimensionless units or in “real world” units like mm. So to get AD files to scale right, you need to copy the x and y viewBox dimensions into the svg width and height parameters.

So…

  1. Set up your AD document using whichever units you want (probably inches or mm) at 96 dpi.
  2. Export to SVG. If you leave the Raster DPI field blank, it will use the dpi you already set for the document.
  3. Edit the exported SVG file in a text editor. In the svg tag near the top of the file, replace the width and height values (which Affinity Designer sets to “100%”) with the values from the viewBox parameter later in the same line.

In other words, change

<svg width=“100%” height=“100%” viewBox=“0 0 1920 1152” … >

to

<svg width=“1920” height=“1152” viewBox=“0 0 1920 1152” … >

(using the specific viewBox parameters from your file, of course).

8 Likes