如何在nodejs-canvas上安装Google字体？

2024-05-18 • 问答

我正在尝试使用nodejs-canvas动态获取Google字体，但我不确定什么是最好的方法。我了解它必须与：“ registerFont”方法一起使用。这是我现在拥有的代码：

const { registerFont,createCanvas,loadImage } = require('canvas')
//registerFont('comicsans.ttf',{ family: 'Comic Sans' })
const canvas = createCanvas(200,200)
const ctx = canvas.getcontext('2d')

let name = req.query.name;

// Write "Awesome!"
ctx.font = '30px Impact'
ctx.rotate(0.1)
ctx.fillText(name,50,100)

// Draw line under text
var text = ctx.measureText(name)
ctx.strokeStyle = 'rgba(0,0.5)'
ctx.beginPath()
ctx.lineTo(50,102)
ctx.lineTo(50 + text.width,102)
ctx.stroke()

//console.log(canvas.toDataURL());

res.write('<img style="border:1px solid #000;" src="' + canvas.toDataURL() + '" />');
res.end();

以PT Mono为例，这就是您的操作方式。

在这种情况下，PT Mono首先直接转到字体。
下一步，单击右上角的“下载系列”链接。这将为您提供一个包含TTF字体的zip文件。
现在将ttf文件复制到您的节点应用程序目录中，并像这样在文件中使用registerFont。

registerFont('PtMono-Regular.ttf',{ family: 'PT Mono' });

根据文档，请确保在创建画布之前注册字体。

然后在画布上使用字体，只需使用以下内容为上下文设置字体。

ctx.font = "16px 'PT Mono'";

使用我们的Google字体的完整示例，只是修改了node-canvs repo中的原始示例。

const { registerFont,createCanvas } = require('canvas');
registerFont('PtMono-Regular.ttf',{ family: 'PT Mono' });

const canvas = createCanvas(500,500);
const ctx = canvas.getContext('2d');

ctx.font = '16px 'PT Mono'"'
ctx.fillText('This is the font.',250,10);

如何在nodejs-canvas上安装Google字体？

jayparkcj 回答：如何在nodejs-canvas上安装Google字体？

大家都在问