danmarshall / google-font-to-svg-path

Create an SVG path from a Google font

Home Page:https://danmarshall.github.io/google-font-to-svg-path

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Unbounded Font Bugs

charlieforward9 opened this issue · comments

Thanks for making this fantastic tool! It should help me avoid png->svg conversions of that turn into a headache. Unfortunately, there are gaps in the letters that have overlapping shapes, so I cannot use this as expected, yet...

I tried playing with the numbers, but nothing seemed to work...

Screen Shot 2023-03-29 at 1 16 51 AM

Not all fonts play nice 😁

It isn't common for a font to have geometries which overlap. Typically, each closed geometry is completely enclosed by another. The underlying library Maker.js assumes this.

The irony here is that the font is named Unbounded, so perhaps this by design 🤔 - but I don't think so, when you look at other glyphs such as a, e, 8, &:

image

I believe these overlaps need to be corrected in the font itself.

You may want to contact the font authors to let them know:
https://twitter.com/googlefonts/status/1602970743683354624

no, actually it is very common for variable fonts (VF) to have such self-overlapping geometries, this allows them to be more easily interpolated at runtime, and rendering engines know that and always use non-zero fill rule when rendering them, so no gaps appear.
This is a quote from the OT spec:

https://learn.microsoft.com/en-us/typography/opentype/spec/glyf#simple-glyph-description

Note that variable fonts often make use of overlapping contours. This has implications for tools that generate static-font data for a specific instance of a variable font, if broad interoperability of the derived font is desired: if a glyph has overlapping contours in the given instance, then the tool ... should merge contours to remove overlap of separate contours.

To workaround this, the user could download the static fonts for Unbounded (from the "Download family" button, e.g. https://fonts.google.com/download?family=Unbounded) and then use fonttools to remove overlaps; this in turns requires skia-pathops, but can be installed in one go with a command like pip install fonttools[pathops] (requires Python 3.8+).
Then you would do, e.g.:

$ fonttools ttLib.removeOverlaps Unbounded-Regular.ttf Unbounded-Regular-no-overlaps.ttf

(apologies for cross-posting, I meant to add the comment & screenshot below to this issue, not the other one..)

here's the Regular with overlaps removed as explained above, then manually uploaded to the google-font-to-svg-path site:

image

Very educative, thank you! I will use this workaround until you a solution is implemented into the service. Thank you for all of the open source contributions!

Thanks @anthrotype , I didn't know that overlapping in VF! The underlying libraries pre-date the rise of variable fonts, so there will probably need to be an update.