Markdown 常用图例(流程图 时序图 甘特图)
Posted 顧棟
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Markdown 常用图例(流程图 时序图 甘特图)相关的知识,希望对你有一定的参考价值。
流程图语法
标准流程图
竖向
文字部分三个`后面增加mermaid
flowchat
open=>start: Open:>http://www.baidu.com
userInput=>inputoutput: User Input
processes=>operation: Processes
results=>condition: Yes or No?
regis=>condition: GoSignUp,Yes or No?
userr=>operation: SignUp
end=>end: End
open->userInput->processes->results
results(yes)->end
results(no)->regis
regis(yes)->userr
regis(no)->userInput
效果图
横向
文字部分
flowchat
st=>start: Start|past:>http://www.baidu.com
e=>end: End:>http://www.baidu.com
op1=>operation: My Operation|past
op2=>operation: Stuff|current
sub1=>subroutine: My Subroutine|invalid
cond=>condition: Yes or No?|approved:>http://www.baidu.com
c2=>condition: Good idea|rejected
io=>inputoutput: catch something...|request
st->op1(right)->cond
cond(yes, right)->c2
cond(no)->sub1(left)->op1
c2(yes)->io->e
c2(no)->op2->e
效果图
简化流程图
竖向
文字部分
graph TD
F[竖向流程图]
A[方形] -->B(圆角)
B --> C条件a
C -->|a=1| D[结果1]
C -->|a=2| E[结果2]
效果图
横向
文字部分
graph LR
F[横向流程图]
A[方形] --> B(圆角)
B --> C条件a
C --> |a=1| D[结果1]
C --> |a=2| E[结果2]
效果图
UML时序图
文字部分
sequenceDiagram
对象A->>对象B: 给你发请求(请求)
Note right of 对象B: 对象B的描述
Note left of 对象A: 对象A的描述(提示)
对象B-->>对象A: 收到你的消息(响应)
效果图