Skip to content
chartjs2img

chartjs2img

どこでも Chart.js を画像に。

クイックスタートAI エージェントで使うGitHub
01-bar-chart03-line-chart05-pie-chart07-radar-chart10-bubble-chart11-mixed-chart-bar-line13-bar-with-data-labels14-line-with-annotation15-treemap-chart18-japanese-labels01-bar-chart03-line-chart05-pie-chart07-radar-chart10-bubble-chart11-mixed-chart-bar-line13-bar-with-data-labels14-line-with-annotation15-treemap-chart18-japanese-labels

同じ JSON から、2 つの出力先へ

Chart.js は同じ設定 JSON をブラウザで読み込んで対話的なチャートを描画します。chartjs2img はその同じ JSON を受け取り PNG を返すので、受信側にブラウザがなくても Slack・メール・PDF レポートに添付できます。

図 — Chart.js JSON から 2 つのフローが分岐。上段は Chart.js がブラウザで直接レンダリングして対話チャートに。下段は chartjs2img が PNG を生成し、Slack やメールに添付される。

Chart.js + 12 プラグイン同梱

コア + datalabels / annotation / zoom / gradient / treemap / matrix / sankey / wordcloud / geo / graph / venn / date-fns アダプタ。追加インストール不要。

HTTP API + CLI

JSON を POST すれば画像が返ります。または JSON を CLI にパイプしてファイル出力。同じエンジン・同じキャッシュ・同じプラグイン。

ハッシュベースキャッシュ

同一リクエストは即座にキャッシュヒット。SHA-256 ハッシュをヘッダで返すので CDN フレンドリーな URL を組み立てられます。

LLM ネイティブ

`chartjs2img llm` が Chart.js + 全プラグインの完全リファレンスを Markdown で出力。エージェントに投げれば初手で正しい config を書かせられます。

JSON を投げれば、画像が返る

Chart.js 設定を JSON で送ると、chartjs2img はレンダリング済み PNG を返します。右の設定に対する実際の出力が左側です。

Chart.js 設定 (JSON)
…
レンダリング PNG (800 × 600)
bar-chart
Showcase

複雑なチャートもまとめて描画

複数プラグインの組み合わせ — 時間軸・注釈・データラベル・積み上げ・デュアル軸 — すべて 1 回の JSON リクエストで描けます。

showcase-revenue-with-forecast

売上と予測バンド

時系列の折れ線にグラデーションを被せ、予測ウィンドウ（annotation）・目標閾値・ピーク点マーカー・各点の値ラベルを重ねた構成。

showcase-ops-dashboard

運用ダッシュボード

積み上げ棒のチケット残量に、右軸の SLA 違反率の折れ線を重ねた運用スナップショット。閾値ラインとピーク負荷帯の注釈つき。

AI-native

LLM エージェント駆動を前提に設計

4 つの一級エージェント統合チャネル — 既に使っているホストを選べます。どの経路も同じ Chart.js JSON を扱うので、エージェント間で設定が可搬。

さっそくレンダリングを

サインアップ不要・API キー不要 — 全てローカルで動きます。

ガイドを読むAI エージェントで使うGitHub

オープンソースの肩の上に

chartjs2img は以下のプロジェクトの上に立っています。ライセンスと告知は Docker イメージとソースツリーに同梱しています。