ドキュメント — DiagramZu

このページの内容

コンセプト

クイックスタート

MCP セットアップ

REST API

コンセプト

DiagramZu が想定する3つのワークフロー

AI の提案をレビュー

AI が新しいアーキテクチャを提案すると、ここに図を作成します。600 行の説明文を読む代わりに、数秒でレビューできます。

チームに引き継ぐ

アーキテクチャを1つのリンクで共有。バージョン履歴がいつ何が変わったかを記録します。今は人が、後で AI エージェントが読めます。

プレゼンで再利用

エンジニアがレビューした図を、CEO や CPO がそのままスライドに使います。情報源は1つ、3つではありません。

図の種類

DiagramZuを支える4つのアイデア。エージェントを向ける前にこちらを一読してください。

説明はエージェントへのブリーフ

図表は記述された目的を往復します。閲覧者は公開共有でそれを見て、次のエージェントはget_diagramでそれを受け取ります。

AIが図表を作成または更新するときは、最初に1〜2文の説明を書かせてください。その説明は公開共有リンクを開いた人にはページの副題として表示され、次に図表を取得するエージェントが読むものです。これをブリーフとして扱ってください — なぜとなにを書き、どのようにはコードに任せます。

第一級

往復

1000文字制限

公開共有リンク

図表を閲覧専用でレンダリングする公開URLを発行します。

共有リンクはAIが作成した図表をDiagramZuの外に出す方法です。リンクは推測不能(22文字)で、サインインなしで動作し、レンダリング済みの図表のみを表示します — エディタもコードもありません。図表の共有メニューからいつでも任意のリンクを取り消せます。URLは即座に動作しなくなります。チームのオンボーディングドキュメント、アーキテクチャレビューのスレッド、READMEの「例を見る」リンクなどに使ってください。

閲覧専用

取り消し可能

サインイン不要

バージョン履歴

スナップショットは手動です。AIはupdate_diagramでcreateVersion: trueを渡し、人間はツールバーのバージョン保存をクリックします。

キーストロークごとの自動バージョン管理はありません — それはノイズに埋もれてしまいます。バージョンは意図的に取られます: 人間のチェックポイントによって、または意味のある変更をした直後のエージェントによって。過去のバージョンを復元すると、まず現在の状態のセーフティスナップショットが書き込まれるので、作業を失うことはありません。新規としてフォークは、バージョンを別の図表にコピーし、元の図表はそのままにします。

手動

復元時にセーフティスナップショット

新規としてフォーク

layout: "auto"

layout: "auto"を設定すると、決定論的な分類器がグラフの形状に基づいて6つの具体的なレイアウトから1つを選びます。

ツリー図はelk.mrtreeに、密で循環のあるグラフはelk.forceに、整理されたDAGはdagreに解決されます。分類器は保存時に一度だけ実行され、解決された値が永続化されます — 図表に"auto"が保存されることはないため、表示される図は再現可能です。ツールバーから明示的にレイアウトを選んで上書きすることもできます。

ワンショット

6つのレイアウト

サーバー解決

クイックスタート

AIにDiagramZuを使わせるための3ステップ。

STEP 01

新規登録

スペースを作成し、チームメイトを招待。

STEP 02

API トークンを作成

/app/settings/tokens を開いてトークンを生成。コピーは即座に — 二度と表示されません。

STEP 03

AI ツールに追加

下のスニペットを Claude / Cursor / ChatGPT の設定に貼り付け。

MCP セットアップ

DiagramZuはHTTPトランスポート経由で8つのツールを公開します。一度インストールすれば、エージェントは図表、フォルダ、バージョン履歴に対する読み取り、書き込み、解析プリミティブを使えるようになります。

インストール

Claude Code

ターミナルで以下を実行し、dz_live_xxx をあなたの API トークンに置き換えてください。

Bash

claude mcp add --scope user --transport http diagramzu https://mcp.diagramzu.ai/mcp \
  --header "Authorization: Bearer dz_live_xxx"

Claude Desktop

Claude の設定ファイル(macOS:~/Library/Application Support/Claude/claude_desktop_config.json、Windows:%APPDATA%\Claude\claude_desktop_config.json)を編集し、アプリを再起動してください。

JSON

{
  "mcpServers": {
    "diagramzu": {
      "type": "http",
      "url": "https://mcp.diagramzu.ai/mcp",
      "headers": {
        "Authorization": "Bearer dz_live_xxx"
      }
    }
  }
}

Cursor

~/.cursor/mcp.json を編集し、Cursor を再起動してください。

JSON

{
  "mcpServers": {
    "diagramzu": {
      "type": "http",
      "url": "https://mcp.diagramzu.ai/mcp",
      "headers": {
        "Authorization": "Bearer dz_live_xxx"
      }
    }
  }
}

ツールリファレンス

読み取りツール

list_diagrams

Space内の図表を検索します。

使う場面 create_diagramの前に呼び出して、既存の同名図表との重複を避けるか、後に呼び出して最新の一致を取得します。

例

{
  "query": "DB schema",
  "sortBy": "updatedAt",
  "sortDir": "desc"
}

list_folders

Space内のフォルダを一覧表示します。

使う場面新しい図表を特定の場所に置く可能性があるときに呼び出します。「Infra」や「Schema」のようなフォルダがあれば、ルートよりそちらを優先してください。

例

{}

get_diagram

IDで1つの図表を、説明を含めて取得します。

使う場面何を変更するか決める前に、説明をブリーフとして読んでください。

例

{
  "id": "dgm_abc123"
}

list_versions

図表の手動スナップショットを新しい順に一覧表示します。

使う場面リスクのある上書きの前に、どの復元ポイントがあるかを知るために使います。

例

{
  "id": "dgm_abc123"
}

get_version

図表の過去のバージョンを1つ取得します。

使う場面図表の変遷を理解するため、または現在のバージョンにはない内容を復元するために、過去のスナップショットを読みます。

例

{
  "id": "dgm_abc123",
  "versionId": "ver_xyz789"
}

書き込みツール

create_diagram

Spaceに図表を作成します。

使う場面常に最初に説明を書いてください — それが今後の呼び出しのためのエージェントブリーフになります。人間が管理するフォルダの下に図表を整理するにはfolderIdを設定します。

例

{
  "title": "User signup flow",
  "description": "Auth path from /signup → verify → first login.",
  "code": "graph TD; A-->B-->C",
  "folderId": "fld_..."
}

update_diagram

既存の図表のタイトル、説明、コード、またはstyleOptionsを更新します。

使う場面変更が意味のあるものなら、createVersion: trueを渡してください — 将来の自分が復元ポイントを欲しがるはずです。versionLabelは履歴ドロワーに表示されます。

例

{
  "id": "dgm_abc123",
  "code": "graph LR; A-->B-->C-->D",
  "createVersion": true,
  "versionLabel": "added retry path"
}

解析

analyze_diagram

図表の構造的な批評を返します — 孤立ノード、高次数ハブ、循環、切り離されたコンポーネント。

使う場面複雑な図表を簡素化する前、または生成したコードがきれいなグラフを生成しているかのサニティチェックとして使います。

例

{
  "id": "dgm_abc123"
}

REST API

すべてのリクエストは Bearer トークンで認証します。ベース URL は https://diagramzu.ai。$SPACE_ID はあなたのスペース ID(アプリ内の URL に表示)に置き換えてください。

エンドポイント

curl · 一覧

# List diagrams in your Space
curl -H "Authorization: Bearer $DIAGRAMZU_TOKEN" \
  https://diagramzu.ai/api/spaces/$SPACE_ID/diagrams

curl · 作成

# Create a new diagram
curl -X POST -H "Authorization: Bearer $DIAGRAMZU_TOKEN" \
  -H "Content-Type: application/json" \
  -d '{"title":"My diagram","code":"graph TD; A-->B"}' \
  https://diagramzu.ai/api/spaces/$SPACE_ID/diagrams

curl · 更新

# Update a diagram
curl -X PATCH -H "Authorization: Bearer $DIAGRAMZU_TOKEN" \
  -H "Content-Type: application/json" \
  -d '{"code":"graph LR; A-->B-->C"}' \
  https://diagramzu.ai/api/spaces/$SPACE_ID/diagrams/<DIAGRAM_ID>

DIAGRAMS

Method	Path	Description
GET	`/api/spaces/[spaceId]/diagrams`	List diagrams. Same filters as list_diagrams.
POST	`/api/spaces/[spaceId]/diagrams`	Create a diagram.
GET	`/api/spaces/[spaceId]/diagrams/[id]`	Fetch one diagram.
PATCH	`/api/spaces/[spaceId]/diagrams/[id]`	Update title, code, description, or styleOptions.
DELETE	`/api/spaces/[spaceId]/diagrams/[id]`	Delete a diagram.
GET	`/api/spaces/[spaceId]/diagrams/[id]/thumbnail`	Rendered thumbnail.
GET	`/api/spaces/[spaceId]/diagrams/[id]/analysis`	Structural analysis (same as analyze_diagram).
POST	`/api/spaces/[spaceId]/diagrams/export/png`	Render arbitrary Mermaid code to PNG.

FOLDERS

Method	Path	Description
GET	`/api/spaces/[spaceId]/folders`	List folders.
POST	`/api/spaces/[spaceId]/folders`	Create a folder.
PATCH	`/api/spaces/[spaceId]/folders/[id]`	Rename or reparent a folder.
DELETE	`/api/spaces/[spaceId]/folders/[id]`	Delete a folder.

VERSIONS

Method	Path	Description
GET	`/api/spaces/[spaceId]/diagrams/[id]/versions`	List versions, newest first.
POST	`/api/spaces/[spaceId]/diagrams/[id]/versions`	Snapshot the current state.
GET	`/api/spaces/[spaceId]/diagrams/[id]/versions/[vid]`	Fetch one version.
POST	`/api/spaces/[spaceId]/diagrams/[id]/versions/[vid]/restore`	Restore a version (auto-snapshots first).
POST	`/api/spaces/[spaceId]/diagrams/[id]/versions/[vid]/fork`	Fork a version into a new diagram.

Method	Path	Description
GET	`/api/spaces/[spaceId]/diagrams/[id]/shares`	List active share links.
POST	`/api/spaces/[spaceId]/diagrams/[id]/shares`	Mint a new share link.
DELETE	`/api/spaces/[spaceId]/diagrams/[id]/shares/[shareId]`	Revoke a share link.
GET	`/public/share/[slug]`	Public read endpoint (no auth).

TOKENS

Method	Path	Description
GET	`/api/spaces/[spaceId]/tokens`	List API tokens (no secrets).
POST	`/api/spaces/[spaceId]/tokens`	Create a token. Secret returned ONCE.
DELETE	`/api/spaces/[spaceId]/tokens/[id]`	Revoke a token.

あなたの Space ID を見つける

ログイン後、API トークンページを開いてください — 現在のスペースの ID が見出しの横に表示され、コピーできます。