Diagrammo (dgmo)

@diagrammo/dgmo-mcp

将对话变成真正的图表——无需离开你的 AI 工具。

这个 MCP 服务让 Claude（以及任何兼容 MCP 的 AI 工具）能够根据简洁的文本标记渲染 时序图、流程图、ER 图、C4 架构图、甘特图以及另外 40 多种图表类型——然后将结果交给完整的 编辑器进行完善。在聊天中提出绘图需求，就能得到一张真正的图表。

你可以做什么

用自然语言提出需求——“把身份验证流程画成时序图”、“把 Q3 计划绘制成甘特图”、“把我们的服务画成 C4 图”——Claude 就会编写标记并渲染图表。标记清晰易读，也便于查看差异：

flowchart Mutiny Resolution
direction-tb

[Sail]     Set sail under the captain
{Trouble?} Discontent in the crew?
{Vote}     Crew vote called
[Mutiny]   Seize the ship

(Sail) -> (Trouble?)
(Trouble?) -Yes-> (Vote)
(Vote) -Mutiny-> (Mutiny)

→ 渲染结果就是上方的流程图。所有渲染都在本地完成——图表数据不会离开你的设备。

工具

工具	功能说明	支持 HTTP
render_diagram	将 DGMO 标记渲染为 SVG 或 PNG	是
validate_diagram	检查标记并报告解析错误，不进行渲染	是
suggest_chart_type	根据描述推荐适合的图表类型	是
list_chart_types	列出所有支持的图表类型，并标注 Beta 类型	是
get_language_reference	获取 DGMO 语法文档，便于准确生成	是
get_examples	获取图表类型的完整示例	是
share_diagram	获取可分享的 diagrammo.app URL — 将图表交给网页编辑器	是
open_in_app	将图表直接在 Diagrammo 桌面应用中打开以便编辑	否
check_app_installed	报告桌面应用是否已安装	否
preview_diagram	渲染一个或多个图表，并在浏览器中打开 HTML 预览	否
generate_report	构建精美的多章节 HTML 报告，包含目录和可选源代码	否
put_space_diagram	按文件夹和标题将图表写入 Diagrammo Cloud 空间	是
get_space_diagram	按 ID 或文件夹和标题读取 Cloud 空间中的图表	是
list_space_diagrams	列出 Cloud 空间中的所有图表	是

这三个空间工具会将图表发送到 Diagrammo Cloud。它们需要一个空间 API 密钥 （在 Diagrammo 账户页面生成），并将其作为 DGMO_API_KEY 设置在服务端环境中 — 绝不能将其作为工具参数传入，这样密钥就不会出现在对话记录中。

share_diagram 和 open_in_app 是从聊天中跳转出去的桥梁：Claude 生成的图表 可以进一步完善、调整样式并嵌入到其他地方 — 详见下文。

标记为否的四个工具会打开浏览器或启动桌面应用。通过 HTTP 使用时，这些操作会 在运行服务的机器上执行，而不是在你的机器上，因此不会通过 HTTP 提供 — 详见通过 HTTP 提供服务。

MCP 服务之外

MCP 服务是进入 Diagrammo 的一个入口 — 这是一个基于同一 DGMO 标记构建的完整生态系统。通过聊天生成，在真正的编辑器中完善，随处嵌入：

• diagrammo.app — 桌面应用。open_in_app 会将 AI 生成的图表直接放入其中，并提供实时预览、调色板和导出功能。
• online.diagrammo.app — 完整的浏览器编辑器，无需安装。 share_diagram 生成的 URL 会直接在此打开。
• 文档集成 — 将 DGMO 围栏代码块放入你的文档站点： remark-dgmo, astro-dgmo, docusaurus-plugin-dgmo, fumadocs-dgmo.
• Obsidian — Diagrammo Diagrams 社区插件可在你的库中渲染 DGMO。
• 命令行界面 — npx @diagrammo/dgmo-cli file.dgmo -o out.png，或者使用 npm install -g @diagrammo/dgmo-cli 安装（macOS 和 Linux）。

一种标记，到处可用。 在这里生成的图表，在应用、文档和 Obsidian 中的渲染效果完全一致 — 因为它们都使用 DGMO。

→ 前往 diagrammo.app 免费试用

设置

最简单的方式 — 一条命令

安装 dgmo CLI，让它为你完成所有配置：

npm install -g @diagrammo/dgmo-cli   # macOS and Linux
dgmo install                         # auto-detects Claude Code, Codex, Claude Desktop, Cursor, …

更喜欢 Homebrew 或 pacman？请参阅 diagrammo.app/dev。

dgmo install 会以非交互方式配置每个检测到的助手，并将其指向 dgmo mcp，因此无需单独安装软件包，也无需回答提示。使用 dgmo install claude-code（或 codex、claude-desktop 等）即可指定一个客户端。

手动配置

更喜欢自己编辑配置？通过 npx 将任意 MCP 客户端指向此服务（无需全局安装）：

Claude Code — .claude/settings.local.json；Claude Desktop — ~/Library/Application Support/Claude/claude_desktop_config.json：

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

如果已安装 dgmo CLI，也可以使用 { "command": "dgmo", "args": ["mcp"] }。保存后重启客户端，工具便会自动显示。

通过 HTTP 提供服务

上述配置会将服务作为子进程启动，并通过标准输入和输出与其通信。这要求服务和客户端在同一台机器上。如果它们不在同一台机器上——例如使用托管 Agent 平台、容器，或由多人共用一台服务——则可改为将其作为 HTTP 端点启动：

npx -y @diagrammo/dgmo-mcp --http            # http://127.0.0.1:3333/mcp
MCP_TRANSPORT=http MCP_PORT=8080 npx -y @diagrammo/dgmo-mcp

每个选项都可以通过标志或环境变量设置，具体取决于你的配置方式：

标志	变量	默认值	说明
--http	MCP_TRANSPORT=http	关闭	提供可流式传输的 HTTP，而非 stdio
--port <n>	MCP_PORT	3333	监听端口
--host <addr>	MCP_HOST	127.0.0.1	绑定的网络接口
--path <path>	MCP_PATH	/mcp	端点响应的路径
--allow-host <h>	MCP_ALLOWED_HOSTS	loopback	允许的其他 Host 标头，可重复指定
--allow-origin <o>	MCP_ALLOWED_ORIGINS	own origin	允许的 Origin 标头，可重复指定

每个请求都会独立处理——没有会话，也不会在调用之间保留任何内容——因此一个端点可以同时为多个客户端提供服务。

此服务本身不提供身份验证。 默认绑定到 loopback，并拒绝携带未获允许的 Host 标头，或与自身来源不同且未通过 --allow-origin 指定的 Origin 标头的请求；对于同一台机器或同一容器内的客户端而言，这已经足够。任何可从更广泛网络访问的服务都需要在其前面配置你自己的身份验证，并通过 --allow-host 指定访问该服务时使用的主机名。在未指定主机名的情况下绑定到非 loopback 接口时，会打印警告。

--help 会显示此处所有内容，具体取决于已安装的版本。

隐私

所有渲染都在本地进行。你的图表标记和生成的图像不会离开你的机器，除非你主动调用 share_diagram（该工具会将图表编码到 diagrammo.app URL 中）。请参阅隐私条款。

开发中心（AI 调优工具）

pnpm hub

一条命令、一个服务、一个浏览器标签页。开发中心会在一个带标签页的外壳中打开这三款 AI 调优开发工具——通过顶部标签页在它们之间切换，无需记住不同的端口或命令：

• 触发词调优 — 编辑驱动 suggest_chart_type 的短语/概念词汇，为提示词实时评分，并保存回 triggers.json。
• LLM 评审器 — 使用 claude -p，根据提示词评审图表类型描述。
• 指导工作室 — 编写服务提供的各类型样式指导（即 dgmo 的 language-reference.md 中的 `` 块，这些内容会被分段传入 get_language_reference）：选择类型，编辑如何指示 AI 设置样式，针对已提交的数据集样例运行提示词（确保不同运行之间输入始终不变），并排查看生成的 DGMO 和渲染图像。类型选择器也可显示覆盖率进度条；“比较 3×”会渲染无指导版本和你的提示，方便目视比较；保存时会验证内容并写回 language-reference.md。

这些工具仅供开发使用，不会打包进已发布的服务中。（如果你想单独运行某个工具，独立的 pnpm harness 和 pnpm studio 脚本仍可各自运行一个工具。）

贡献与发布

开发环境设置和发布工作流请参阅 CONTRIBUTING.md。

许可证

MIT