search

Automattic / node-canvas

Node canvas is a Cairo backed Canvas implementation for NodeJS.
10.13k stars 1.17k forks source link

Issue with loading custom fonts using registerFont() #2244

Open mirko-ll opened 1 year ago

mirko-ll commented 1 year ago

Issue with loading custom fonts using registerFont()

Note: I have tried multiple fonts so problem is not in font files... Keep getting this error below and output in fallback font...

(process:22832): Pango-WARNING **: 12:52:05.268: couldn't load font "Zen Dots Not-Rotated 40px", falling back to "Sans Not-Rotated 40px", expect ugly output.

Steps to Reproduce

registerFont("./ZenDots-Regular.ttf", {
  family: "Zen Dots",
});

const canvasInit = canvas.createCanvas(1000, 500);
const ctx = canvasInit.getContext("2d");

ctx.font = '40px "Zen Dots"';

const color = "#ffffff";
ctx.fillStyle = color;
ctx.fillText(
  "Whereas disregard and contempt for human rights have resulted",
  10,
  100
);
// etc.

Your Environment

bvitlas commented 1 year ago

same here. Were you able to handle it right way ?

squishyu commented 1 year ago

@bvitlas This appears to be an issue with the newer versions of canvas. I've been tearing my hair out trying to figure out if it's an issue in my code.

Reverting to version 2.9.0 of canvas fixed the issue for me.

2.9.1

2.9.1

2.9.0

2.9.0

simonhaenisch commented 10 months ago

Posted some findings here: https://github.com/Automattic/node-canvas/issues/2097#issuecomment-1803950952

  • It only happens when there is any custom font installed, either in /usr/share/fonts or in $HOME/.local/share/fonts. If both of those directories are empty, then registerFont works fine.
  • Installing the custom font into the OS instead of using registerFont makes it work. Having the custom font installed in the system but then also calling registerFont with the same font breaks it again.
  • It doesn't happen with canvas@2.9.0 but any later version (tried 2.9.1 and 2.11.2), so the assumption that it was caused by the changes of #1987 makes a lot of sense.