node-canvas：使用自定义字体

我想知道如何使用自定义字体与节点canvas。

这是我的尝试，但目前为止还不行：

var Canvas = require('canvas') , Image = Canvas.Image , Font = Canvas.Font , path = require('path'); var gubblebum = new Font('gubblebum', fontFile('GUBBLO___.ttf')); function fontFile(name) { return path.join(__dirname, '../fonts', name); } function draw() { var canvas = new Canvas(100, 100) , ctx = canvas.getContext('2d'); ctx.addFont(gubblebum); ctx.font = 'bold 40 gubblebum'; ctx.fillText('test', 25, 45); return canvas; } module.exports = draw; 

在浏览器中呈现时，字体与默认值以及大小保持不变。

字体文件被正确加载。 否则，将抛出exception。

有趣的是，当我做ctx.font ='bold 40 someGibberish'; 字体大小正确应用。

Answer 1

所以我最终得到节点canvas以处理自定义字体。

首先，我使用了开罗的旧版本。 我用Brew来安装所有的依赖关系，因为它告诉我哪些是我拥有的，哪些是正确链接的，然后一旦所有依赖关系正常工作，我从Brew卸载开罗版本并安装版本1.12.X（补丁版本18我认为这是）开罗。 这解决了与字体大小的Mac OSX问题，但我无法加载字体。

所以经过一番调查后，我发现最近的Node Canvas模块也出现了问题，所以我在我的package.json中将版本设置为1.1.0，最后我得到了自定义字体来正确载入和resize。

所以TL; DR ：使用开罗版本1.12.X和节点canvas1.1.0，它应该工作，我认为？ 我花了一段时间才得到它的工作。

Answer 2

现在应该在node-canvas 2.0中“Just Work”（目前在alpha中，但是相对稳定）。 查看新的Canvas.registerFont方法： https ： //github.com/Automattic/node-canvas/#registerfont-for-bundled-fonts 。