mermaid

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

Mermaid Diagrams for Chatbots

聊天机器人专用Mermaid图表

Use this skill to create Mermaid diagrams that render well in Markdown chat interfaces, validate their syntax locally, and render images without calling a web service.

使用本技能创建可在Markdown聊天界面中良好渲染的Mermaid图表，在本地验证其语法，无需调用网络服务即可渲染图像。

Workflow

工作流程

Identify the diagram type (flowchart, sequenceDiagram, stateDiagram-v2) based on the request.
Draft Mermaid code in a fenced Markdown block using
```
mermaid
```
.

Follow formatting conventions in

references/chatbot-mermaid-guidelines.md

Validate the diagram using
```
scripts/validate_mermaid.py
```
.
If the user wants an image file, render with
```
scripts/render_mermaid.py
```
.

根据需求确定图表类型（flowchart、sequenceDiagram、stateDiagram-v2）。
在Markdown围栏代码块中使用
```
mermaid
```
语法编写Mermaid代码草稿。

遵循

references/chatbot-mermaid-guidelines.md

中的格式规范。

使用
```
scripts/validate_mermaid.py
```
验证图表。
如果用户需要图像文件，使用
```
scripts/render_mermaid.py
```
进行渲染。

Scripts

脚本说明

```
scripts/validate_mermaid.py
```
- Validate Mermaid code by invoking the local Mermaid CLI (
```
mmdc
```
  ).
- Use when you need to check whether Mermaid parses without errors.
```
scripts/render_mermaid.py
```
- Render Mermaid to SVG/PNG/PDF using the local Mermaid CLI (
```
mmdc
```
  ).
- Prefer SVG for Markdown renderers when image embedding is required.

```
scripts/validate_mermaid.py
```
- 调用本地Mermaid CLI（
```
mmdc
```
  ）验证Mermaid代码。
- 用于检查Mermaid代码是否能无错误解析。
```
scripts/render_mermaid.py
```
- 使用本地Mermaid CLI（
```
mmdc
```
  ）将Mermaid图渲染为SVG/PNG/PDF格式。
- 当需要嵌入图像时，优先选择SVG格式以适配Markdown渲染器。

Notes

注意事项

These scripts expect
```
mmdc
```
to be available on PATH (Mermaid CLI). If missing, instruct the user to install it locally; do not use the Mermaid web service.
Dependencies are managed via inline
```
uv
```
script metadata in each Python script. Use
```
--install-chromium
```
to bootstrap the Chromium binary via pyppeteer when needed.
Keep diagrams compact and readable in chat: avoid overly wide graphs, use short labels, and group related states.
If the user asks for raw Markdown, return only the fenced
```
mermaid
```
block unless they ask for extra explanation.

这些脚本要求
```
mmdc
```
已添加到系统PATH中（即已安装Mermaid CLI）。如果未安装，请指导用户在本地安装；不要使用Mermaid网络服务。
依赖项通过每个Python脚本中的内联
```
uv
```
脚本元数据进行管理。必要时使用
```
--install-chromium
```
参数通过pyppeteer引导安装Chromium二进制文件。
保持图表简洁，便于在聊天中阅读：避免过宽的图表，使用简短标签，并对相关状态进行分组。
如果用户要求原始Markdown格式，除非他们需要额外说明，否则仅返回带围栏的
```
mermaid
```
代码块。