Affinity Designer, SVGs, and scaling


#1

Trying to use Affinity Designer to do some print and cut tests. Basically, I’ve found the only workflow that works is to both print and upload using the same PDF. If you try to print directly to the printer, everything is slightly larger than it should be, and if you export to SVG and upload that to the Glowforge, everything is also slightly larger (but not by the same amount). I took a look at the SVG, and it is using dimensionless units for the viewBox depending on the DPI you exported at. This thread seems to indicate that GF is expecting 96 dpi, so I tried that, still came out slightly too large.

“Printing” to PDF then using that file to feed both the printer and the Glowforge seems to be the only way to get proper dimensions out of Affinity. Has anyone found any different?

(My quick and dirty print and cut alignment was based off of Jules’ helpful document, but instead of cutting out little windows on the cut sheet, I just cut three registration crosses on a base sheet, then aligned the printed registration crosses on the cut sheet over those by just overlaying it and trying to make out where they were. Turns out it is kind of hard to do that kind of thing precisely using crosses; concentric circle bullseyes may be easier.)


#2

I can only offer limited advice, since I don’t have my Glowforge yet to verify how this scales, but…

I don’t use the print-to-PDF method you mention. But if you use the Export to SVG, and see that it’s slightly larger, try lowering the DPI from 96 to 90. That was suggested on the Affinity support forums for someone else having an Inscape/Affinity SVG issue.

Usually what I do is I export out of Affinity with 96 DPI, then when I open it in Inkscape I immediately go into the Document Properties and change the Page “Display units” to inches. Once you do that, I see that the Page Size Scale changes to 96 DPI automatically. After that, rulers and such in Inkscape appear accurate.

image


#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).


#4

I’ve also gotten this to work by changing the width and height value to the explicit dimensions of the Affinity Designer canvas. E.g. “2.5in” or “100mm”


Affinity Designer Basics with Glowforge
#5

Okay, I think you nailed it!

One way to avoid mucking around with post-processing the SVG is to click the More button on the Export pane. Set “Use DPI” to 96 instead of document resolution, unset “Set viewBox”, and while we’re in here might as well set “Export text as curves”. Click Manage Presets to add a preset, name it Glowforge, and use that from then on. The result is no viewBox parameter is set on the root node and the width/height is set in pixels at 96 DPI. Result imports at the right size.


Affinity Designer and rectangles
Artwork getting scaled up Affinity Designer [Resolved]
Glowforge Interface - Correctly Save a File as an SVG for the GFUI :thinking:
#6

Perfect!

I’m sure the Serif folks have their reasons, but it’s strange to me that they linked the presence (or rather absence) of a viewBox with explicit dimensions for the svg as a whole. I’d prefer to see a “Use explicit dimensions” checkbox. On the other hand, now that I have a preset made, I never need to worry about it again. :tada:


#7

You are solving problems before I even have them. I’m also going to be Affinity Designer, I’ll know to follow these steps.


#8

Just to add a visual for people (I’m a visual learner, myself):