Skip to main content
Glama
deenesjakoruzh
JVmano

diagram-mcp

by JVmano
OverviewSchemaRelated ServersScoreDiscussions
TypeScript
Local

diagram-mcp

MCP 服务器，将图表即代码文本渲染为您磁盘上的 PNG 文件。无需浏览器、无需网络、无需外部服务。适合生成流程图，放入文档、工单或 README 中。

example

工具

  • render_diagram：将代码渲染为 PNG，返回文件路径

  • preview_diagram：将图表绘制为文本图形，直接显示在对话中，不写入文件

  • validate_diagram：解析并报告带行号的错误，不写入任何内容

  • diagram_syntax：语言参考

Related MCP server: Vizdown-MCP

安装

需要 Node 20.12+。

git clone https://github.com/JVmano/diagram-mcp.git
cd diagram-mcp
npm install
npm run build

然后将其注册到 Claude Code：

claude mcp add diagram --scope user \
  --env DIAGRAM_MCP_OUTPUT_DIR=$HOME/Documents/diagram-renders \
  -- node "$(pwd)/dist/index.js"

或者手动将其添加到 .mcp.json / 您的用户配置：

{
  "mcpServers": {
    "diagram": {
      "type": "stdio",
      "command": "node",
      "args": ["/absolute/path/to/diagram-mcp/dist/index.js"],
      "env": { "DIAGRAM_MCP_OUTPUT_DIR": "/absolute/path/to/renders" }
    }
  }
}

重启会话，然后请求一个图表。拉取更改后，再次运行 npm run build。

语言

title "Reward approval flow"
direction TB

node event "Conversion recorded" shape=rounded
node auto "Auto-approve?" shape=diamond size=200x100
node queue "Manual review queue"

event -> auto
auto -> queue "no"

形状：rect、rounded、ellipse、diamond、hexagon。连接：from -> to ["label"] [style=solid|dashed]。使用 at=x,y 指定的位置是可选的。省略它们，布局将自动放置形状。调用 diagram_syntax 获取完整参考。

配置

全部为可选配置，且都有默认值。参阅 .env.example。渲染输出到 DIAGRAM_MCP_OUTPUT_DIR（默认 ~/Documents/diagram-renders）。显式的 outputPath 必须位于该目录或工作目录内，除非 DIAGRAM_MCP_ALLOW_ANY_OUTPUT_PATH=true。

开发

npm test          # unit tests
npm run test:e2e  # builds, then drives the server over stdio
npm run verify    # typecheck, test, build, e2e

src/core 中的解析器、布局和 SVG 生成与一个本地图表编辑器项目共享；当该项目被检出到相邻目录时，npm run check:sync 会将它们与该项目进行差异比较。

许可证

MIT

Install Server
A
license - permissive license
A
quality
C
maintenance

How are these scores calculated?

Maintenance

–Maintainers
–Response time
–Release cycle
–Releases (12mo)
Commit activity

Resources

Unclaimed servers have limited discoverability.

Looking for Admin?

If you are the server author, to access and configure the admin panel.

Tools

Related MCP Servers

View all related MCP servers

Related MCP Connectors

  • netcafe-images

    Diagrams, badges, charts and QR codes as plain image URLs you can paste into Markdown.

  • jsoncanvas

    Create, validate, edit, export (markdown/svg/png/mermaid), and search JSON Canvas files.

  • Diagrams MCP

    Generate cloud architecture diagrams, flowcharts, and sequence diagrams.

View all MCP Connectors

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/JVmano/diagram-mcp'

If you have feedback or need assistance with the MCP directory API, please join our Discord server