diagramport

diagramport

diagramport は Mermaid 構文から Mermaid の図やチャートを生成します。図を渡すと — graph TD; A-->B; など — 指定した形式で返します。構文そのもの、共有可能な mermaid.ink リンク、またはご自身のマシンで設定したレンダラーコマンドが生成するレンダリング済み画像を取得できます。

レンダリング以外はすべてローカルで処理され、常に動作します。まず構文が検証され、共有リンクは図のテキストからネットワーク呼び出しなしで生成されます。

インストール

npx @reneturcios/diagramport generate --mermaid "graph TD; A-->B;" --output-type mermaid

または、コンテナーイメージを実行します。

docker run -i ghcr.io/cloudcorprecords/diagramport

コンテナーはデフォルトで MCP サーバーとして動作します（以下を参照）。CLI として使用するには、CLI 引数を渡してください。

CLI

# Validate syntax only (exit 1 with the reason when invalid)
diagramport validate --mermaid "graph TD; A-->B; A-->C; B-->D; C-->D;"

# Return the validated syntax
diagramport generate --mermaid "graph TD; A-->B;" --output-type mermaid

# Build a shareable mermaid.ink link (SVG or PNG)
diagramport generate --mermaid "graph TD; A-->B;" --output-type svg_url
diagramport generate --mermaid "graph TD; A-->B;" --output-type png_url

# Render an image (needs DIAGRAMPORT_RENDERER_COMMAND, see below)
diagramport generate --mermaid "graph TD; A-->B;" --output-type base64
diagramport generate --mermaid "graph TD; A-->B;" --output-type file

diagramport --version

終了コード：成功時は 0、構文が無効またはレンダリングに失敗した場合は 1（エラーに問題の内容が示されます）、使用方法に誤りがある場合は 2 です。

MCP サーバー

1 つのバイナリーが両方の用途に対応します。mcp サブコマンドで stdio MCP サーバーを起動します。

npx -y @reneturcios/diagramport mcp

MCP クライアントの設定：

{
  "mcpServers": {
    "diagramport": {
      "command": "npx",
      "args": ["-y", "@reneturcios/diagramport", "mcp"]
    }
  }
}

ツール

ツール	入力	戻り値
generate_mermaid_diagram	mermaid（文字列、必須）— Mermaid 図の構文、theme（文字列、任意、デフォルトは default）、backgroundColor（文字列、任意、デフォルトは white）、outputType（文字列、任意、デフォルトは base64）— base64、svg、mermaid、file、svg_url、png_url のいずれか	outputType によって異なります。mermaid は検証済みの構文をテキストで返します。svg_url／png_url は公開 mermaid.ink リンクを返します。base64 はレンダリング済み PNG 画像を Base64 エンコードした文字列で返します。svg はレンダリング済み SVG マークアップを返します。file はレンダリング済み PNG 画像をディスクに保存し、そのパスを返します。

検証

出力を生成する前に、構文をローカルで確認します。空でない最初の行は、既知の図の種類（graph、flowchart、sequenceDiagram、classDiagram、stateDiagram、stateDiagram-v2、erDiagram、journey、userJourney、gantt、pie、gitGraph、mindmap、timeline、quadrantChart、requirementDiagram、C4Context）で始まる必要があり、引用符と角括弧は対応していなければなりません（二重引用符で囲まれたラベル内の角括弧は数えません）。構文が無効な場合は、理由を示すエラーが報告されます。レンダラーやリンク生成処理に渡されることはありません。これは構造上の簡易チェックであり、Mermaid の構文を完全に解析するものではありません。

共有リンク

svg_url と png_url では、diagramport がローカルでリンクを生成します。ペイロードは図のテキストを UTF-8 から Base64URL エンコードしたもので、https://mermaid.ink/svg/（SVG）または https://mermaid.ink/img/（PNG）に追加されます。リンクを開くと、mermaid.ink によって図がレンダリングされます。diagramport 自体はリンク生成のためにネットワークを呼び出しません。

レンダリング

diagramport にはレンダラーが含まれていません。図を画像にレンダリングするには Mermaid エンジンと、通常はヘッドレスブラウザーが必要ですが、これらは意図的に運用者に委ねられています。base64、svg、file の出力タイプは、DIAGRAMPORT_RENDERER_COMMAND 環境変数で指定されたローカルコマンドを使ってレンダリングします。コマンドは標準入力から図のテキストを受け取り、標準出力にレンダリング済み画像のバイト列を書き込む必要があります。

export DIAGRAMPORT_RENDERER_COMMAND="my-mermaid-renderer --format png"
diagramport generate --mermaid "graph TD; A-->B;" --output-type base64

レンダラーが設定されていない場合、これらの出力タイプは DIAGRAMPORT_RENDERER_COMMAND を示すエラーを返します。画像のバイト列が捏造されたり、スタブで代用されたりすることはありません。file の出力は、DIAGRAMPORT_OUTPUT_DIR が設定されていればそのディレクトリーに、設定されていなければ ./diagrams/ に、タイムスタンプ付きの .png ファイル名で保存されます。

開発

npm install
npm run build   # tsc -> dist/
npm test        # node test runner over test/*.test.ts, no network, fake renderer only
npm run dev     # run the CLI from source via tsx

ライセンス

MIT — LICENSE を参照してください。