Some fonts included on Macs rasterize totally blank. about fontdue

[kettle11]

Because I know how to have fun on New Years Eve I decided to try to put together a fix.

This commit in my fork fixes the issue for all fonts I tested: kettle11@3dce741

The way it works is for each glyph it calculates and keeps track of the winding direction of the left most path (is path the correct term?).

If the left most path wraps counter-clockwise, then the glyph's points are reversed, otherwise they are not.

This is not a perfect solution. It will produce incorrect results if a path intended to be subtractive is left of a path intended to be solid. But it seems most fonts use subtractive (counter-clockwise) paths to represent holes on the interior of as solid area.

Likely it introduces a small performance hit, but I have not tested that yet.

I also have not rigorously tested this with a wide array of fonts, but it seems promising for the few I did test.

[mooman219]

It's not that I'm assuming the wrong ordering, it's that the font is actually out of spec. Font engines like FreeType do a very expensive operation to check the winding order if it produces a blank output. I'm considering doing this on startup for fontdue

[simast]

I downloaded Inconsolata from your link and was not able to reproduce the issue with Inconsolata-VariableFont_wdth,wght.ttf or Inconsolata-Regular.ttf.

That's weird as the font file I am seeing this issue is static\Inconsolata-Regular.ttf in the download.

This commit in my fork fixes the issue for all fonts I tested

Just tested your changes and I can confirm that this also fixes Inconsolata font issue with ) glyph I described above.

[rkanati]

Seeing the same symptoms with iosevka-regular.ttf - correct metrics, but the image is a big ol' bucket of 0. I'll have a go with kettle's fix and see what happens.

Update: the fix works; suddenly I have glyphs!

[mooman219]

I'll use a heuristic to guess the winding order of the glyph on startup. Should be in the spirit of what Kettle11 did

[kettle11]

Adding some investigation:

For HelveticaNeue.ttc the 'a' character appears, but the rest appear to be wrapping the opposite direction.

For NewYork.ttf fontdue is assuming the wrong wrapping direction and if the wrapping is reversed then the font appears for all characters I tested.

[kettle11]

I assume this is related to this issue somehow: RazrFalcon/ttf-parser#43

[kettle11]

Oh no. I assumed such mainstream fonts would be in spec.

One thing I noticed is that I could take the absolute value of the produced float to get a reasonable looking result, but I assume that’s a bad idea for some reason?

[mooman219]

I have some fonts where that doesn't work :( , some transform operations specified in the font can also result in bad winding orders. Browser grade (chromium) handling of this is actually just guess and check.

[kettle11]

Inter (a very popular font) also has this issue.

'q' appears to be a reflection of 'p' so it rasterizes blank.

Edit: I couldn't actually replicate this with the newest version of Inter.

I checked and I was using this old version: https://github.com/rsms/inter/releases/tag/v3.13
with Inter-3-2/Inter Hinted for Windows/Desktop/Inter-Regular.ttf

The issue still replicates for the old version, but I wonder why they changed it in the newer versions?

[simast]

Just hit the same issue with Inconsolata font. In particular ) glyph is rasterized with width/height but the bitmap is all empty bytes (0s).

[kettle11]

@simast I downloaded Inconsolata from your link and was not able to reproduce the issue with Inconsolata-VariableFont_wdth,wght.ttf or Inconsolata-Regular.ttf.

Are you using another .ttf?

[mooman219]

This probably works cb2e9b2. Can anyone confirm they still have the issue with this fix?

I tested these characters real quick on a few fonts and they worked correctly

a, b, c, d, e, f, g, h, i, j, k, l, m, n, o, p, q, r, s, t, u,
v, w, x, y, z, A, B, C, D, E, F, G, H, I, J, K, L, M, N, O, P,
Q, R, S, T, U, V, W, X, Y, Z, 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, !,
@, #, $, %, ^, &, *, (, ), _, +, -, =, `, ~, [, ], \\, ;, \,
,, ., /, {, }, |, :, ", <, >, ?, «, ¼, ½, ¾, ¿, »,

Roboto-Regular.ttf
RobotoMono-Regular.ttf
Comfortaa-Regular.ttf
Inconsolata-Regular.ttf
Exo2-Regular.otf

[mooman219]

I decided to make a more robust test, so I am now testing all glyphs in the following fonts:

Roboto-Regular.ttf
RobotoMono-Regular.ttf
Comfortaa-Regular.ttf
Inconsolata-Regular.ttf
FasterOne-Regular.ttf
Exo2-Regular.otf
GreatVibes-Regular.otf
modernpics.otf

I found an issue in my original heuristic so I decided to just do it right the second time and added some heavier math to actually calculate the winding right.