Some of my elements often end up with a lot of attributes in the `style` attribute which are not used. I'm not always clear where they came from, but they can sometimes interfere with display. For example, some of mine got a 'visibility' value set which is breaking their group visibility. This has been propagated to a lot of other elements and it's a pain to clean them up manually.
Is there some way to remove all non-essential attributes, or specifically promote visual style properties to attributes, like fill/stroke?
----
In my particular case I don't know what happened, but I have a bunch of element with `style` attributes that look like this now:
SVGO has lots of options which might do what you want. If you write down the settings you used in the webpage gui, there is an extension for inkscape https://github.com/juanfran/svgo-inkscape
Although if you are doing a lot of files, might want to write a script.
Thank you, but those tools remove/change too much for me, and also affect the entire file.
I have scripts that do the optimizations I want on the files, but the problem here is that it isn't an optimization. Some of those attributes are breaking the rendering in the browser, and I don't know where they came from. I've removed them by hand for now and many elements.
'SVGO has a plugin-based architecture, so almost every optimization is a separate plugin'
As far as I can see you can just use the plugin you want ( if you are happy to use node.js ). There is a plugin convertStyleToAttrs.js
I suppose the questions is, what exactly is a unused style, and can you safely remove it - or does its effects need to be accounted for and somehow converted into an attribute.
If you know which ones you can get rid of, then it should be easy from that point.
Beginners' Questions Can I clean up unused style attributes?
Inkscape.org
Some of my elements often end up with a lot of attributes in the `style` attribute which are not used. I'm not always clear where they came from, but they can sometimes interfere with display. For example, some of mine got a 'visibility' value set which is breaking their group visibility. This has been propagated to a lot of other elements and it's a pain to clean them up manually.
Is there some way to remove all non-essential attributes, or specifically promote visual style properties to attributes, like fill/stroke?
----
In my particular case I don't know what happened, but I have a bunch of element with `style` attributes that look like this now:
```
color:#000000;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:medium;line-height:normal;font-family:sans-serif;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-variant-east-asian:normal;font-feature-settings:normal;font-variation-settings:normal;text-indent:0;text-align:start;text-decoration:none;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000000;letter-spacing:normal;word-spacing:normal;text-transform:none;writing-mode:lr-tb;direction:ltr;text-orientation:mixed;dominant-baseline:auto;baseline-shift:baseline;text-anchor:start;white-space:normal;shape-padding:0;shape-margin:0;inline-size:0;clip-rule:nonzero;display:inline;overflow:visible;visibility:visible;isolation:auto;mix-blend-mode:normal;color-interpolation:sRGB;color-interpolation-filters:linearRGB;solid-color:#000000;solid-opacity:1;vector-effect:none;fill:#e9f8f8;fill-opacity:1;fill-rule:nonzero;stroke:none;stroke-width:1.43689;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;color-rendering:auto;image-rendering:auto;shape-rendering:auto;text-rendering:auto;enable-background:accumulate;stop-color:#000000
```
Inkscape does have 'Save As' Optmised svg which uses scour.
However for what you want have a look at this interactive page - https://jakearchibald.github.io/svgomg/
SVGO has lots of options which might do what you want. If you write down the settings you used in the webpage gui, there is an extension for inkscape https://github.com/juanfran/svgo-inkscape
Although if you are doing a lot of files, might want to write a script.
Thank you, but those tools remove/change too much for me, and also affect the entire file.
I have scripts that do the optimizations I want on the files, but the problem here is that it isn't an optimization. Some of those attributes are breaking the rendering in the browser, and I don't know where they came from. I've removed them by hand for now and many elements.
According the main svgo gihub page https://github.com/svg/svgo
'SVGO has a plugin-based architecture, so almost every optimization is a separate plugin'
As far as I can see you can just use the plugin you want ( if you are happy to use node.js ). There is a plugin convertStyleToAttrs.js
I suppose the questions is, what exactly is a unused style, and can you safely remove it - or does its effects need to be accounted for and somehow converted into an attribute.
If you know which ones you can get rid of, then it should be easy from that point.
I wrote something going the opposite way a while ago - https://inkscape.org/~bipper/%E2%98%85attributes2style
There are the SVG output settings. I'd try those.