Hello,

I am having trouble with doing some simple modifications to a simple shape, saving it as a plain SVG and then rendering it in HTML within a <svg> tag.

First what works for me. If I start out with a new document and create a new shape and then immediately save that as a SVG I am able to open the .svg file, extract out the path data (the d attribute in the XML) and then render a simple <svg> element. The problem occurs when I make changes to the shape. If I just simply move the shape up or do a simple resize by dragging on the handles and then re-save, I get a transform attribute within the SVG XML file and the path hasn't changed. Ultimately what I need is for the path itself to update.

Now what I have tried is doing path --> simplify which does just that but something about the way the path is modified messes things up. The path seems unnaturally large and when I try to use it for HTML nothing shows up in the browser even if I increase the sizes of the view box.

Here's an example of the path differences with simply for clarity:

Freshly created shape


Modified shape by dragging on handle to make it larger and then running path --> simplify


So now ultimately, my question. I need to make simple SVG's but my requirement is ONE path and any modifications I make such as moving or resizing needs to be reflected within that path.

Any guidance is very much appreciated

Go to Inkscape Preferences Shift + Ctrl + P. Go to Behavour >> Transformations >> and check Optimization box for the transformations.
Note the precise location of any node of a shape on Inkscape, is set to 8 decimal digits. You can also change it on Inkscape Preferences, but it could led to strange shape deformations.
Also, you can save as Plain SVG, or Optimized SVG, which it allows to save less code in the SVG.

Please, read the Guide that it's below in my firm . It's still vigent