svgo
svgo copied to clipboard
feature request: tool to convert paths with fill-rule="evenodd" to fill-rule="nonzero"
So I have an interesting case where I'm having issues with fill-rule="evenodd"
not working properly with compound shapes (inner holes) and I'm wondering if svgo could have a plugin to convert these paths to fill-rule="nonzero"
in a similar method as FontForge's "Correct Direction" tool (source here: https://github.com/fontforge/fontforge/blob/ae2f40b2f213b2d645d5a9f1e7a55475cbfe84ea/fontforge/scripting.c#L5505) which would essentially re-wind the points of internal paths.
Thoughts?
@jwilson8767 hi, are you solved this problem?
I am using Workshape/icon-font-generator
and my icons also has fill-rule="evenodd"
so I have filled inner holes in my font-icons
So now I'm looking for a solution to solve it
This would make it easier to export custom icons from various design tools into a custom FontAwesome package via a plugin. Their system relies on the default fill-rule="nonzero"
.
@eli-crow Check out https://github.com/nfroidure/svgicons2svgfont/issues/62 where more discussion was done on this.
I had a problem and can fix it in Inkscape. In Inkscape you can turn on show direction of paths.
The path of the hole on the left is in the opposite direction to the one on the right
which causes the icon to be rendered as follows
To fix this I just need to select the hole on the right and reverse the path direction. What would be nice is if we had a svgo plugin that could do this automatically. I'm not sure how it will know which direction the line should be though. SVG rendering programs seem to render this with two holes, it's only when I try to convert it to a font that I see the issue.
Maybe this wasm module can solve the fill-rule problem https://www.npmjs.com/package/pathkit-wasm?activeTab=readme
FYI it can be done with picosvg
pip3 install picosvg picosvg in.svg > out.svg
I get this error:
picosvg moon.svg > out.svg
Traceback (most recent call last):
File "<frozen runpy>", line 198, in _run_module_as_main
File "<frozen runpy>", line 88, in _run_code
File "E:\Programs\Python\Python311\Scripts\picosvg.exe\__main__.py", line 7, in <module>
File "E:\Programs\Python\Python311\Lib\site-packages\picosvg\picosvg.py", line 61, in main
app.run(_run, argv=argv)
File "E:\Programs\Python\Python311\Lib\site-packages\absl\app.py", line 308, in run
_run_main(main, args)
File "E:\Programs\Python\Python311\Lib\site-packages\absl\app.py", line 254, in _run_main
sys.exit(main(argv))
^^^^^^^^^^
File "E:\Programs\Python\Python311\Lib\site-packages\picosvg\picosvg.py", line 43, in _run
svg = SVG.parse(input_file).topicosvg()
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
File "E:\Programs\Python\Python311\Lib\site-packages\picosvg\svg.py", line 1313, in topicosvg
svg.topicosvg(ndigits=ndigits, inplace=True)
File "E:\Programs\Python\Python311\Lib\site-packages\picosvg\svg.py", line 1346, in topicosvg
raise ValueError(
ValueError: Unable to convert to picosvg: BadElement: /svg[0]/mask[0]
I found more about this problem at StackOverflow. Hope it is helpful. Searching for an node library for that problem.
Found a library for outlining svgs which worked for me well.