markdown绘制流程图相关代码片段记录

有时候会使用typora来绘制一些流程图,进行编码之类的工作,在网络搜集了一些笔记,做个记录,方便日后进行复习,相关的记录如下:

每次作图时,代码以「graph <布局方向>」开头,如:

复制代码
graph TB
    A(开始)
    B[打开冰箱门]
    C{"冰箱小不小?"}
    D((连接))

TB(Top Bottom)表示从上向下布局,另外三种是

BT

LR(Left Right)

RL
开始 打开冰箱门 冰箱小不小? 连接

不同种类的括号对应不同的节点图形

括号中的文字就是显示在节点中的描述

A B C D 这些字符是为节点取的名字,这个名字可以在之后反复利用(在编程里这相当于定义变量)

线段用于连接节点,一同来看一下:

复制代码
graph TB
    A[把大象放进去] --> B{"冰箱小不小?"}
    B -->|不小| C[把冰箱门关上]
    B -->|小| D[换个大冰箱]

上述 -->是带箭头线段,-->|不小| 是加了描述文字的带箭头线段。它们都位于两个节点之间。

上一个代码示例中,B{"冰箱小不小?"} 这里的描述文字加了引号,是因为其中包含特殊字符(问号),用引号包裹防止出错为节点取名为 A B C 不太合适,如果节点很多时往往容易混淆,不方便后续使用和阅读(编程时命名的重要性)。建议起有意义的名字,除上述带箭头线段 --> 外,还有带箭头虚线线段 -.->、 带箭头加粗线段 ==>、不带箭头线段 ---
不小 小 把大象放进去 冰箱小不小? 把冰箱门关上 换个大冰箱

复制代码
graph TB
    Start(开始) --> Open[打开冰箱门]
    Open --> Put[把大象放进去]
    Put[把大象放进去] --> IsFit{"冰箱小不小?"}
    
    IsFit -->|不小| Close[把冰箱门关上]
    Close --> End(结束)
        
    IsFit -->|小| Change[换个大冰箱]
    Change --> Open

不小 小 开始 打开冰箱门 把大象放进去 冰箱小不小? 把冰箱门关上 结束 换个大冰箱

复制代码
graph TB
    A(MOVE MOTOR) --> B[RAMPMODESET velocity_positive]
    B --> C[SET AMAX = 1000, SET VMAX = 100000 OR DIFFERENT VALUE]
    C --> D(MOTOR MOVES, CHANGE VMAX AS NEEDED)

MOVE MOTOR RAMPMODESET velocity_positive SET AMAX = 1000, SET VMAX = 100000 OR DIFFERENT VALUE MOTOR MOVES, CHANGE VMAX AS NEEDED

复制代码
graph LR
A[方形] -->B(圆角)
    B --> C{条件a}
    C -->|a=1| D[结果1]
    C -->|a=2| E[结果2]
    F[横向流程图]

a=1 a=2 方形 圆角 条件a 结果1 结果2 横向流程图

复制代码
graph TD
A[方形] --> B(圆角)
    B --> C{条件a}
    C --> |a=1| D[结果1]
    C --> |a=2| E[结果2]
    F[竖向流程图]

a=1 a=2 方形 圆角 条件a 结果1 结果2 竖向流程图

复制代码
flowchat
st=>start: 开始框
op=>operation: 处理框
cond=>condition: 判断框(是或否?)
sub1=>subroutine: 子流程
io=>inputoutput: 输入输出框
e=>end: 结束框
st(right)->op(right)->cond
cond(yes)->io(bottom)->e
cond(no)->sub1(right)->op

Created with Raphaël 2.3.0 开始框 处理框 判断框(是或否?) 输入输出框 结束框 子流程 yes no

复制代码
sequenceDiagram
对象A->>对象B: 对象B你好吗?(请求)
Note right of 对象B: 对象B的描述
Note left of 对象A: 对象A的描述(提示)
对象B-->>对象A: 我很好(响应)
对象A->>对象B: 你真的好吗?

对象A 对象B 对象B你好吗?(请求) 对象B的描述 对象A的描述(提示) 我很好(响应) 你真的好吗? 对象A 对象B 标题:复杂使用

复制代码
sequenceDiagram
Title: 标题:复杂使用
对象A->>对象B: 对象B你好吗?(请求)
Note right of 对象B: 对象B的描述
Note left of 对象A: 对象A的描述(提示)
对象B-->>对象A: 我很好(响应)
对象B->>小三: 你好吗
小三-->>对象A: 对象B找我了
对象A->>对象B: 你真的好吗?
Note over 小三,对象B: 我们是朋友
participant C
Note right of C: 没人陪我玩

对象A 对象B 小三 C 对象B你好吗?(请求) 对象B的描述 对象A的描述(提示) 我很好(响应) 你好吗 对象B找我了 你真的好吗? 我们是朋友 没人陪我玩 对象A 对象B 小三 C 标题:复杂使用

复制代码
%% 时序图例子,-> 直线,-->虚线,->>实线箭头
  sequenceDiagram
    participant 张三
    participant 李四
    张三->王五: 王五你好吗?
    loop 健康检查
        王五->王五: 与疾病战斗
    end
    Note right of 王五: 合理 食物 <br/>看医生...
    李四-->>张三: 很好!
    王五->李四: 你怎么样?
    李四-->王五: 很好!

张三 李四 王五 王五你好吗? 与疾病战斗 loop [健康检查] 合理 食物 看医生... 很好! 你怎么样? 很好! 张三 李四 王五 标题:复杂使用

复制代码
flowchat
st=>start: 开始框
op=>operation: 处理框
cond=>condition: 判断框(是或否?)
sub1=>subroutine: 子流程
io=>inputoutput: 输入输出框
e=>end: 结束框
st->op->cond
cond(yes)->io->e
cond(no)->sub1(right)->op

Created with Raphaël 2.3.0 开始框 处理框 判断框(是或否?) 输入输出框 结束框 子流程 yes no

复制代码
flowchat
st=>start: MOVE TO A TARGET POSITION
op=>operation: RAMPMODE SET position
sub1=>subroutine: CONFIGURE RAMP PARAMETERS
op1=>operation: SET XTARGET
cond=>condition: NEW ON-THE-FLY TARGET?
cond1=>condition: CHANGE OF ANY PARAMETERS REQUIRED?
op2=>operation: SET MOTION PARAMETERS AS DESIRED
cond2=>condition: FLAG Event_POS_reached ACTIVE?
e=>end: TARGET POSITION HAS BEEN REACHED
st->op->sub1->op1
op1->cond
cond(yes)->op1
cond(no)->cond1
cond1(yes)->op2(right)->op1
cond1(no)->cond2
cond2(yes)->e
cond2(no)->cond

Created with Raphaël 2.3.0 MOVE TO A TARGET POSITION RAMPMODE SET position CONFIGURE RAMP PARAMETERS SET XTARGET NEW ON-THE-FLY TARGET? CHANGE OF ANY PARAMETERS REQUIRED? SET MOTION PARAMETERS AS DESIRED FLAG Event_POS_reached ACTIVE? TARGET POSITION HAS BEEN REACHED yes no yes no yes no

附录一个源码链接:

https://download.csdn.net/download/weixin_44317448/88841198

相关推荐
好评12412 分钟前
Linux入门:软件包管理、Vim、GCC、Makefile、Git 与 GDB
linux·运维·服务器
Laravel技术社区15 分钟前
用PHP8实现斗地主游戏,实现三带一,三带二,四带二,顺子,王炸功能(第二集)
前端·游戏·php
郑州光合科技余经理18 分钟前
PHP构建:支撑欧美澳市场的同城生活服务平台开发
java·开发语言·数据库·uni-app·php·排序算法·生活
m0_738120721 小时前
应急响应——知攻善防Web-3靶机详细教程
服务器·前端·网络·安全·web安全·php
لا معنى له4 小时前
目标检测的内涵、发展和经典模型--学习笔记
人工智能·笔记·深度学习·学习·目标检测·机器学习
石像鬼₧魂石6 小时前
内网渗透靶场实操清单(基于 Vulhub+Metasploitable 2)
linux·windows·学习·ubuntu
Danileaf_Guo7 小时前
256台H100服务器算力中心的带外管理网络建设方案
运维·服务器
醇氧8 小时前
org.jetbrains.annotations的@Nullable 学习
java·开发语言·学习·intellij-idea
拾贰_C8 小时前
【Linux | Windows | Terminal Command】 Linux---grep | Windows--- findstr
linux·运维·服务器
JIngJaneIL9 小时前
基于springboot + vue古城景区管理系统(源码+数据库+文档)
java·开发语言·前端·数据库·vue.js·spring boot·后端