Skip to content

国際化

どちらのレンダリングエンジンもホスト OS / コンテナが提供する フォントを使います(既定の skia エンジンはシステムフォント、 browser エンジンは従来のフォントスタック)。Docker イメージには Noto Sans CJK を同梱しており、両エンジンで日本語・中国語・韓国語が 豆腐化せず描画されます。

日本語ラベル

japanese-labels

動く仕組み

  • Docker の場合: Dockerfilefonts-noto-cjk をインストール。 skia エンジン(skia-canvas)も browser エンジン(Chromium)も、 CJK グリフのフォールバックとして自動的に拾います。
  • ホスト (Docker なし) の場合: OS の設定次第。macOS や最近の Windows なら CJK は問題なく動きます。ミニマルな Linux では apt install fonts-noto-cjk 等で追加が必要。

既定以外のロケールの疎通確認

最速のスモークテスト:

bash
# 日本語
echo '{"type":"bar","data":{"labels":["東京"],"datasets":[{"data":[1]}]}}' \
  | chartjs2img render -o /tmp/ja.png

# 中国語
echo '{"type":"bar","data":{"labels":["北京","上海"],"datasets":[{"data":[1,2]}]}}' \
  | chartjs2img render -o /tmp/zh.png

# 韓国語
echo '{"type":"bar","data":{"labels":["서울","부산"],"datasets":[{"data":[1,2]}]}}' \
  | chartjs2img render -o /tmp/ko.png

どれか豆腐化したら、ホストのフォント設定を確認(あるいは Docker イメージを使用)。

右から左のスクリプト

RTL(アラビア語、ヘブライ語)も正しく描画されます — Chart.js と レンダリングエンジン(skia は Skia、browser は Chromium)が テキストレイアウトをネイティブに処理。句読点や bidi isolate も期待通り。RTL 専用フォントパックは同梱していませんが、 Noto Sans のグリフカバレッジで大抵の環境でそのまま通ります。

特定フォントの強制

フォントファミリは3通りで指定できます(Chart.js の options.font.family が全テキスト要素にカスケードします):

  • CLI: --font-family "<名前>"
  • HTTP: リクエストボディの "fontFamily": "<名前>"
  • ライブラリ: fontFamily レンダオプション

CLI / HTTP では、ホストにインストール済みのフォント名を指定する 必要があります(既定の skia エンジンはシステムフォントスタック、 browser エンジンは Chromium のフォントスタックを読みます)。

自前フォントの持ち込み(ライブラリ・システム導入不要)

TypeScript ライブラリからは、フォントパッケージ(例: @fontsource/*)を登録し、skia エンジンで システムフォント未インストールでも描画できます。最小コンテナで CJK・多言語出力を確実にする最も簡単な方法です:

ts
import { renderChart, registerFonts } from 'chartjs2img'
import { createRequire } from 'node:module'
const require = createRequire(import.meta.url)

// bun add @fontsource/noto-sans-jp
await registerFonts({
  'Noto Sans JP': [
    require.resolve('@fontsource/noto-sans-jp/files/noto-sans-jp-japanese-400-normal.woff2'),
  ],
})
await renderChart({ chart, fontFamily: 'Noto Sans JP' })

複数の script subset を1つの family 名にまとめれば合成カバレッジに なります。詳細は ライブラリ API → カスタムフォント を参照。(登録はライブラリ専用。CLI / HTTP の fontFamily は インストール済みフォントの選択のみ。)

このページを編集Last updated: