Search code examples
node.jsfonts

How to render text using a font and access raw pixel data (in Node.js)


Is there any way to render a text using an existing font and access the raw pixel data in Node.js? I am trying to implement a VideoRenderer for the (kinda ancient) CD+G format. In this format there is no instruction to just render text. You have to render 6x12 pixel tiles by a providing the raw pixel data. Currently I'm using some code I found on the internet which contains the raw bytes for ASCII characters of a monospaced font called "Terminus". Please note that I am not in a browser context. I'd be happy for any hint, even if it's not directly linked to Node.js (e.g. some solutions in C, PHP or Python).

My inspiration: https://goughlui.com/2019/03/31/tech-flashback-the-cdgraphics-format-cdg/


Solution

  • Okay, I found the answer by myself. It took a look into Bitmap fonts (file extension .bdf). It turned out parsing the font files is extremely easy. For each character they contain the code point and a bitmap which provides the required pixel data. If anyone knows how the same is possible with other font format (TrueType or OpenType), feel free to share your knowledge.