node-canvasとフォントサイズ
ブラウザ上のCanvasで出力している画像を、なんとかnode.js内で出力できないかと思い、node-canvasを試しに使ってみる事にした。
使ってみたところ、ブラウザ上のCanvasでテキストを出力しているのだけど、node-canvasだとフォントサイズが小さいままになっている。 Ubuntuで試していたのだけど、どうもCairoなのかPangoなのか、なにか相性の悪いものがきちんとフォントサイズが取れないみたいだった。
IssueとPull Requestを眺めていたら、フォントに関しての修正を行っているスレッドがあったのでそれを見てみたら、chearon/node-canvasにたどり着いた。
このリポジトリのprefer-pangoブランチで修正を行っているようだったので、早速使用してみる事に。
$ npm install https://github.com/chearon/node-canvas#prefer-pango
インストールはGitリポジトリのURLを直接指定してインストールした。
var Canvas = require('canvas'), fs = require('fs'); Canvas.registerFont( __dirname + '/NotoSansCJKjp-Regular.otf' ); var canvas = new Canvas(300, 300); var context = canvas.getContext('2d'); context.font = '40px NotoSansCJKjp'; context.fillText('能登麻美子', 10, 10); fs.writeFileSync('./canvas.png', canvas.toBuffer());
Notoフォントはあらかじめダウンロードして展開しておく。公式のnode-canvasとフォントの登録の仕方が異なるところを気をつける必要がある。
これで実行してみたところ、期待した通りにフォントサイズが大きくなってくれた。早いところ、公式のnode-canvasにマージされて欲しい。