Inkscape px values in UI don't match SVG values

Question

In Inkscape 1.2.2 on Windows 10 I'm tryint to create an SVG that completely starts off from px measurements, and I'm trying to get the base measurements (widths, heights, stroke widths, etc) all in integer values.

Whatever I try, it keeps smudging tiny fractions from those integers in the .svg file... Here's a repro:

• Create a new document...
  • Document Properties, front page format "Custom" and in "px" measurements
  • Width 120,000 and Height at 50,000 (same for viewbox)
  • Scale at 1,000000 "px per user unit"
  • Display units set to px (same for Preferences > Interface > Grids, both kinds)
• Create a rectangle, and for example the most outer rectangle set to
  • X: 0,000
  • Y: 0,000
  • W: 120,000
  • H: 50,000 ("px" in the dropdown right to it)

The first thing that's weird to me is that the "Stroke style" Width is 1,999 px, and if I set it to 2,000 then the X/Y/W/H values change for the worse. So for now I just fixate the X/Y/W/H and let the stroke width sit at a non-integer value.

• Save the document as an Inkscape .svg file

Result, relevant pieces:

<svg
   width="120.00001"
   height="50.000004"
   viewBox="0 0 120.00001 50.000004"

I'm already confused now... 😮, and after a few bits of metadata the content is equally weird:

<g
  inkscape:label="mylabel"
  inkscape:groupmode="layer"
  id="layer1"
  transform="translate(-97.913445,-31.265988)">
  <rect
     style="fill:none;stroke:#333333;stroke-width:1.999;stroke-dasharray:none"
     id="rect8092"
     width="118.00083"
     height="48.000835"
     x="98.913025"
     y="32.265568"
     inkscape:label="outerbox" />
</g>

That just really doesn't match my UI in Inkscape:

I understand that I'm working on a vector image, not a raster image. But surely I at least can get Inkscape to be precise in following my inputs in the UI?!

I suspect that I'm missing a key point here (is there some kind of scaling somewhere?!) and that this also relates to the Stroke style width issue.

What am I missing!?

Answer 1

The width and height of the document being off by tiny fractions is probably a result of the technical limitations of floating point arithmetic for computers. These rounding errors often compound and cause more and more inaccuracies down the line, which is why the dimensions of objects are even more off.

The best way to avoid this is to set these values directly and not let them be recalculated by Inkscape, since computing floating point numbers is what might introduce rounding errors. Restarting Inkscape before setting your document dimensions may also help.

If you want to be 100% sure that you're using the correct numbers, you can use the 'Edit → XML Editor...' and set the width, height and viewBox attributes on the <svg>-element directly.

Also, make sure to use the 64-bit version of Inkscape (if possible), as 32-bit may introduce bigger rounding errors and more inaccuracies.

Another thing that you can do in Inkscape to mitigate rounding errors is opening the preferences, going to 'Input/Output → SVG Output' and changing the 'Numeric precision' and the 'Minimum exponent' settings. If you keep having problems with rounding errors, you may want to decrease the former and increase the latter a bit.

Note, however that 'precision' here does not mean the number of digits after the decimal point, but the number of significant digits in the whole number – i.e. 123.45678 with a precision of 4 would result in 123.4 not 123.4568. What this means is that, instead of rounding errors, this may now introduce precision errors, so keep this value at a reasonable range. The default (8) is usually a pretty good setting, but going down one or two may help.

Alternatively, you can also 'File → Save as...' your final document as a 'Optimized SVG' and set the 'Number of significant digits for coordinates' in the following dialog, plus a few other useful optimizations. The same caveat explained above applies here as well, though. Just make sure to keep an 'Inkscape SVG' file around, in case you want to edit it later.

Answer 2

This looks like a rounding error to me. I also notice there is a Transform in your SVG, and I suspect that is what is causing the problem. I suspect you may have moved or scaled the rectangle after drawing it.

Instead, if you draw your rectangle, by first enabling snapping to Page Borders in the Advanced Snapping controls, so that the rectangle snaps directly to the page, then you can avoid the transform entirely any scaling.

Here's my Inkscape Plain SVG code when I do that.

<svg
   width="120"
   height="50"
   viewBox="0 0 120 50"
   version="1.1"
   id="svg5"
   xmlns="http://www.w3.org/2000/svg"
   xmlns:svg="http://www.w3.org/2000/svg">
  <defs
     id="defs2" />
  <g
     id="layer1">
    <rect
       style="fill:#ffffff;fill-opacity:1;stroke:#000000;stroke-width:2;stroke-dasharray:none;paint-order:fill markers stroke;stop-color:#000000"
       id="rect4607"
       width="120"
       height="50"
       x="0"
       y="0" />
  </g>
</svg>

Transforms can be quite annoying and there is actually an Apply Transform extension available which can remove transforms by baking them in. This might be one option for you. The link to get it is on github here. Unfortunately, while this works in 1.2.2 it throws a Python deprecation error, but if you follow the instructions in the deprecation error message and change the * character to an @ character in the code, you should be able to run the extension without the error.

Update: Actually looks like Xrott is correct here. The OP should really give the correct answer to him. It is indeed caused by rounding errors when Inkscape recalculates a size after scaling or resizing the rectangle, not the transform/translate. I've struck through these parts of my answer as that was a a red herring. I am going to leave this answer here, as my solution still works as a method to fix it. But you can also select the object, switch to the Rectangle tool, and type in the values in the control bar along the top.