Markdown画流程图、时序图(顺序图)、甘特图

typora 画流程图、时序图(顺序图)、甘特图

复制以下代码使用 typora 的源码模式粘贴到编辑器中查看效果：

以下几个实例效果图如下：

1、横向流程图源码格式：

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

2、竖向流程图源码格式：

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

3、标准流程图源码格式：

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

4、标准流程图源码格式（横向）：

```flow
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
```

5、UML时序图源码样例：

```sequence
对象A->对象B: 对象B你好吗?（请求）
Note right of 对象B: 对象B的描述
Note left of 对象A: 对象A的描述(提示)
对象B-->对象A: 我很好(响应)
对象A->对象B: 你真的好吗？
```

6、UML时序图源码复杂样例：

```sequence
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: 没人陪我玩
```

7、UML标准时序图样例：

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

8、甘特图样例：

```mermaid
%% 语法示例ganttdateFormat  YYYY-MM-DDtitle 软件开发甘特图section 设计需求                      :done,    des1, 2014-01-06,2014-01-08原型                      :active,  des2, 2014-01-09, 3dUI设计                     :         des3, after des2, 5d未来任务                     :         des4, after des3, 5dsection 开发学习准备理解需求                      :crit, done, 2014-01-06,24h设计框架                             :crit, done, after des2, 2d开发                                 :crit, active, 3d未来任务                              :crit, 5d耍                                   :2dsection 测试功能测试                              :active, a1, after des3, 3d压力测试                               :after a1  , 20h测试报告                               : 48h
```

效果图如下：

参考文献：https://www.runoob.com/markdown/md-advance.html

Markdown画流程图、时序图(顺序图)、甘特图相关推荐

xmind8使用甘特图与导出甘特图PDF
1新建思维导图 2打开甘特图视图 3填写甘特图信息 4导出甘特图PDF
5分钟使用markdown画流程图
很多情况下我们需要画流程图,很多工具很复杂,很多功能用不到,很多时候我们只想画简单的流程图,不像有太多的学习负担,下面我们介绍一种方法,通过简单的几个规则用markdown画流程图,不到5分钟即可上手 ...
kali怎么新建文本_甘特图怎么画？零基础快速绘制甘特图的软件
甘特图还有一个别称就是横道图.顾名思义,图形就是用横条表示的.甘特图的意义在于用横条来表示时间的进度,不论是在项目管理过程中,还是公司未来计划安排中都可以选择应用甘特图来清晰明了的表达. 甘特图怎么画 ...
怎么画流程图攻略：思维导图的绘制技巧详解
什么是思维导图?思维导图是流程图的一种,是我们在生活中经常会使用的一个辅助工具,比如说在读书期间在笔记本上记录的树状图.模型图,这些都是思维导图. 一.思维导图的优点正如思维导图的这个命名,它是一种 ...
如何优雅的用 Markdown 画流程图
公众号关注「奇妙的 Linux 世界」设为「星标」,每天带你玩转 Linux ! 今天推荐的这个项目是「mermaid」,一个基于 Javascript 的图表绘制工具,通过解析类 Markdow ...
Microsoft Office 家族甘特图和第三方甘特图软件
前几天因为做项目要画甘特图,项目文档规范中要求使用microsoft project,由于之前使用的是excel,现在为了统一,只好改了.在改之前先上网搜了一下microsoft project这个软 ...
MindManager脑图之项目管理甘特图
MindManager脑图软件曾有个很受欢迎的第三方插件JCVGantt Pro 3.它用以扩充MM的功能,实现项目管理安排,以及制作项目甘特图.在MM8.9等以后的版本中,MM自带了项目管理功能,可 ...
html 甘特图_Rplotly|交互式甘特图（Gantt chart）项目管理/学习计划
甘特图(Gantt chart),又常被称为横道图或者条状图,是现代企业项目管理领域运用最为广泛的一种图示.就是通过条形来显示项目的进度.时间安排等相关情况的. 项目管理外,也可以用来管理学习计划.绘 ...
wps 甘特图_制作甘特图提升办公效率！亿图下的这款项目管理软件很不错
距离春节还有5天很多小伙伴为了提升办公效率可谓绞尽脑汁,但是却没有能够想出办法!其实提醒办公效率的方法有很多,今天小编就为大家分享一种.那就是通过制作甘特图来实现,快来试试看这款亿图旗下的项目管理软 ...

Markdown画流程图、时序图(顺序图)、甘特图

typora 画流程图、时序图(顺序图)、甘特图

Markdown画流程图、时序图(顺序图)、甘特图相关推荐

最新文章

热门文章