1. 程式人生 > 實用技巧 >Markdown 流程圖語法

Markdown 流程圖語法

Flow


將程式碼塊的語言寫為 flow 即可使用

​```flow
這裡是 flow 語句
​```

標準流程圖(縱向):


st=>start: 開始框                  // st 為變數名,任意起名
op=>operation: 處理框
cond=>condition: 判斷框(是或否?)
sub1=>subroutine: 子流程
io=>inputoutput: 輸入輸出框
e=>end: 結束框
st->op->cond
cond(yes)->io->e
cond(no)->sub1(right)->op
a=>start: 開始框
op=>operation: 處理框
cond=>condition: 判斷框(是或否?)
sub1=>subroutine: 子流程
io=>inputoutput: 輸入輸出框
e=>end: 結束框
a->op->cond
cond(yes)->io->e
cond(no)->sub1(right)->op

標準流程圖(橫向):


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

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

Sequence


將程式碼塊的語言寫為 sequence 即可使用

​```sequence
這裡是 sequence 語句
​```

簡易例項:


物件A->物件B: 物件B你好嗎?(請求)   // 直接建立物件,並使用物件。
Note right of 物件B: 物件B的描述   // 冒號前不能有空格
Note left of 物件A: 物件A的描述(提示)
物件B-->物件A: 我很好(響應)
物件A->物件B: 你真的好嗎?
物件A->物件B: 物件B你好嗎?(請求)
Note right of 物件B: 物件B的描述
Note left of 物件A: 物件A的描述(提示)
物件B-->物件A: 我很好(響應)
物件A->物件B: 你真的好嗎?

UML時序圖複雜例項:


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 as B                  // 宣告物件, B 只是原始碼中使用的別名,不會顯示
Note right of B: 沒人陪我玩           // 如果沒有宣告物件,註釋語句會宣告物件
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 as B
Note right of B: 沒人陪我玩

參考

  • 如有雷同,是我抄襲。
  • 筆記做的早,忘記原作者是誰。故沒有連結。