当前位置: 首页 > news >正文

graph TD的规则

Mermaid 中的 graph TD 用于绘制从上到下(Top-Down)的流程图。以下是核心语法规则和示例:


1. 基础结构

graph TDStart --> Stop
  • graph TD 声明流程图方向为 ​从上到下​(LR 表示从左到右)。
  • 每行定义一个节点或节点间的关系。

2. 节点定义

  • 默认矩形节点​:标识[文本]

  • graph TDA[Start] --> B[End]
  • 圆角矩形​:标识(文本)

  • graph TDA(Start) --> B(End)
  • 菱形(决策)​​:标识{文本}

  • graph TDA{Decision} -->|Yes| B[Action]
  • 圆形​:标识((文本))

  • graph TDA((Start)) --> B((End))

3. 连接线样式

  • 实线箭头​:-->

  • graph TDA --> B
  • 无箭头实线​:---

  • graph TDA --- B
  • 虚线箭头​:-.->

  • graph TDA -.-> B
  • 粗实线​:===

  • graph TDA ==> B
  • 添加文字​:

  • graph TDA -->|Label| B   // 或 A -- Label --> B

4. 特殊语法

  • 多节点连接​:

  • graph TDA --> B & C --> D  // A 同时指向 B 和 C,C 指向 D
  • 双向箭头​:

  • graph TDA <--> B
  • 子图(Subgraph)​​:

  • graph TDsubgraph "Group"A --> BendC --> A

5. 转义特殊字符

  • 文本中含 []() 等时用英文引号包裹:
  • graph TDA["[重要]步骤"] --> B["(下一步)"]

6. 注释

  • 单行注释:%% 这是注释
  • graph TD%% 这是一个节点A --> B

完整示例

graph TDA[开始] --> B{条件判断}B -->|是| C[操作1]B -->|否| D[操作2]C --> E((结束))D --> Esubgraph "分组"C --> F[子步骤]end

注意​:在支持 Mermaid 的环境(如 GitHub、Obsidian)直接渲染。语法错误会导致渲染失败,需检查括号/箭头是否闭合。

http://www.dtcms.com/a/313628.html

相关文章:

  • Linux Deepin深度操作系统应用商店加载失败,安装星火应用商店
  • io_getevents 和 io_pgetevents 系统调用及示例
  • [硬件电路-145]:模拟电路 - 常见的电源芯片、用途、管脚定义
  • 深度学习-读写模型网络文件
  • 大模型设计
  • 学习方法论
  • 智能化设备维护:开启高效运维新时代
  • 前端异步任务处理总结
  • Maven - 依赖的生命周期详解
  • 服务端技术栈分类总结
  • 模型预估打分对运筹跟踪的影响
  • 数据结构:单向链表的函数创建
  • [硬件电路-141]:模拟电路 - 源电路,信号源与电源,能自己产生确定性波形的电路。
  • 高质量数据集|大模型技术正从根本上改变传统数据工程的工作模式
  • RapidIO/SRIO 入门之什么是SRIO
  • 环绕字符串中的唯一子字符串-动态规划
  • [2025ICCV-目标检测方向]DuET:通过无示例任务算术进行双增量对象检测
  • 1.内核模块
  • C语言基础03——数组——习题
  • 工作笔记-----IAP的相关内容
  • 8大图床高速稳定网站,值得长期选用
  • 【最长公共前缀】
  • DMDRS产品概述和安装部署
  • Kaggle 竞赛入门指南
  • Pygame如何制作小游戏
  • vllm0.8.5:自定义聊天模板qwen_nonthinking.jinja,从根本上避免模型输出<think>标签
  • Docker环境离线安装指南
  • C++与Go的匿名函数编程区别对比
  • SPI入门(基于ESP-IDF-v5.4.1)
  • accept4系统调用及示例