How do I convert from stroke to path and keep dots with inkscape?

248 Views Asked by At

I have these svg files that I need to upload to fontello to convert them to fonts, some of the icons work by default, some need some tweaking.

Our assets are compiled and updated via CI so I've created a script that:

  1. Converts strokes to paths with inkscape
  2. Uploads the fonts to fontello and downloads the svg generated

This works fine for almost all svg, the ones generated by our design and the ones downloaded from the internet, except when there is a circle generated by (what I assume is) a stroked line with only one dimension

These are the actions I'm running

select-all
selection-ungroup
select-all
selection-ungroup
select-all
object-stroke-to-path
select-all
object-flip-vertical # because fontello flips the icons (might be a bug, might be intentional)

As a command

inkscape --actions="select-all;selection-ungroup;select-all;selection-ungroup;select-all;object-stroke-to-path;select-all;object-flip-vertical;" --export-filename=- $i > $WORK_DIR/$i

A perfect example I can show is the calendar-days from heroicons

heroicons#calendar-days

When you look at the path with a path viewer you can see that its just a line making a dot, because it is stroked it gets rounded corners and gets the circle look

original svg path original svg zoom

When converted with inkscape those small lines are changed to four lines that do not fill

inkscape generated file inkscape generated path zoom inkscape generated preview inkscape generated preview zoom


What have I tried:

First attempt was to change the files. The svg images generated by out designer can be changed, but I would rather not mess with downloaded images (copyright, paid svgs, future updates and all that)

Second thing I've tried was using svg sprites, but because we serve asset files over a CDN domain I couldn't make it work

chrome and firefox block external svg requests and have no plans to change this until the standard is set, the w3c does not want to change the standard because the major browsers are not implementing this

Then I've tried to use svgicons2svgfont to handle the creation of the font locally but the results were awful, most of the images were not correctly sized or placed off center, some were completely butchered to the point they were a mess of paths impossible to use

Could be an issue with config, if anyone have some experience with this I might look into it again

Now the best results I had were with inkscape + fontello, I can leave those problematic images for now but I really need to find a solution for this.

Any advice?

0

There are 0 best solutions below