search

foliojs / fontkit

An advanced font engine for Node and the browser
1.46k stars 219 forks source link

Can't render COLR glyphs #229

Open slikts opened 4 years ago

slikts commented 4 years ago

glyph.render(ctx, size) with COLR glyphs produces the error ctx.fillColor is not a function, even though ctx is an instance CanvasRenderingContext2D (using node-canvas).

COLR glyphs are also missing the glyph.getImageForSize() method, even though it's mentioned in the docs (it's only implemented for SBIX glyphs).

slikts commented 4 years ago

I've edited this line:

ctx.fillColor([color.red, color.green, color.blue], color.alpha / 255 * 100);

Into this:

ctx.fillStyle = `rgba(${color.red}, ${color.green}, ${color.blue}, ${color.alpha / 255 * 100})`;

But it forces it into an infinite loop, since apparently COLR glyphs be nested in their layers.

slikts commented 4 years ago

Apparently COLRGlyph.layer is returning a circular reference (glyph.layers[0].glyph === glyph). This is probably outside of my ability to fix/debug.

devongovett commented 4 years ago

Ah yeah. This was designed for use with PDFKit, which uses the function API. Perhaps we need some kind of adapter for different drawing surfaces?

chearon commented 1 year ago

ctx.fillStyle is one part of the fix, but fontkit is also not calling ctx.beginPath(), so the last color is used for all of the paths. I looked at PDFKit's Document and I don't think it's compatible at all with CanvasRenderingContext2D. An adapter interface would be nice to have.

Apparently COLRGlyph.layer is returning a circular reference (glyph.layers[0].glyph === glyph). This is probably outside of my ability to fix/debug.

I think the infinite looping is a separate issue: #232. It doesn't happen with the fonts in test/data, but it does with a version of Segoe UI Emoji I found on the web.