007高级用法-使用MD来画时序图和流程图

使用MarkDown来画图

sequence时序图

小案例

代码如下:

```mermaid

sequenceDiagram
title: 成员定义
participant A as a
participant B as b
a–>>b : A指向B
b->>a : B指向A

显示结果:

🆒🆒🆒,这简直太cool了，直接在markdown里面用文字生成时序图，其实不知如此
sequence还能更加强大！🔋

正式认识一下sequence

看了上面的例子，我们也知道了,sequence确实强大，可以直接在markdown中输出图像，我们接下来慢慢的把这些图像对应的代码分离出来

掌握了下面4个方法基本就可以使用sequence非常流畅了:

1. 每一个对象(就是方框里面的内容)
2. 对应的连线
3. 注释以及各种说明
4. 标题

sequence对象

想要定义一个对象我们需要在代码前面加上participant^参加者,然后在后面写上对象的名字

例子
participant 我是对象A

展示

同时你也可以给这个对象重命名，方便代码里面后面调用
participant 假如我是一串很长的话 as a
像上面这个样子命名，之后调用他的时候只要敲a就可以了

sequence连线

连线有很多种，最基础的便是黑色的箭头配上实线->,让一个对象指向另一个对象A->B

例子

participant python as p
participant javascript as j
p->j : 你想要添加的说明（这个地方可以留空，但是冒号一定要写）

展示

sequence连线的线和箭头样式

连线和箭头都各有两种样式，他们两两组合一共就有4种可能

连线类型:
单独一个减号(-) 表示这是一条实线
连续两个个减号(–) 表示这是一条虚线

箭头类型:
单独一个箭头(>) 表示这是一个实心的箭头
连续两个个箭头(>>) 表示这是一个空心的箭头

演示

实线实心 ->

实线空心 ->>

虚线实心 -->

虚线空心 -->>

sequence的注释

sequence的注释分为两大类：

1. 在对象两边，或者线条的两边
2. 直接压在线上面

放在两侧的线

使用note right/left of 对象

代码:

participant a
note left of a : 这是放在a左边的对象
participant b
note right of b : 这是放在b右边的对象
a-->>b : 

演示

压在线上面的注释

使用note over 对象(如果有多个对象可以用逗号隔开)

代码:

participant a
participant b
note over a,b : 横跨两条线
a-->>b : 

演示

最后，你需要给你的时序图一个标题

在最开始的地方写上title即可

代码:
title : cool
participant a
participant b
note over a,b : 横跨两条线
a–>>b :

演示

流程图

代码

```mermaid

flowchat
sta=>start: 开始
e=>end: 结束
loading=>operation: 过场

sta->loading->e

开启一个属于我的流程图

1. 定义每个步骤的名称
2. 根据想要显示的内容进行连线

元素类型和连接

startID=>start: 开始框
inputoutputID=>inputoutput: 输入输出框
operationID=>operation: 操作框
conditionID=>condition: 条件框
subroutineID=>subroutine: 子流程
endID=>end: 结束框

startID->inputoutputID->operationID->conditionID
conditionID(no)->subroutineID
conditionID(yes)->endID

访问原链接
https://www.jianshu.com/p/f28c94cf1204

线上画图平台

最终不论是这些图的语法有多好，可能有一些博客都无法支持，这个时候需要把他们转化成图片，这里提供一个线上的转化平台
http://www.plantuml.com/plantuml/uml/SyfFKj2rKt3CoKnELR1Io4ZDoSa70000

可以直接导出PNG，SVG等各种格式，还可以自己选择主题再编辑，非常强大！

回到主目录

https://blog.csdn.net/m0_52475295/article/details/123985863