markdown 畫圖語法

以下畫出了4種流程圖+3種時序圖+2種甘特圖，方便下次需要時直接使用。

1，流程圖

1,1 橫向流程圖

	```mermaid
	graph LR
	A[方形] -->B(圓角)
	    B --> C{條件a}
	    C -->|a=1| D[結果1]
	    C -->|a=2| E[結果2]
	    F[橫向流程圖]
	```

1,2 豎向流程圖

	```mermaid
	graph TD
	A[方形] --> B(圓角)
	    B --> C{條件a}
	    C --a=1-->  D[結果1]
	    C --a=2-->  E[結果2]
	    F(豎向流程圖)
	```

1,3 豎向標準流程圖

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

1,4 橫向標準流程圖

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

2, UML時序圖

2,1 UML時序圖樣例

	```mermaid
	sequenceDiagram
	對象A->>對象B: 對象B你好嗎?（請求）
	Note right of 對象B: 對象B的描述
	Note left of 對象A: 對象A的描述(提示)
	對象B-->>對象A: 我很好(響應)
	對象A->>對象B: 你真的好嗎？
	```

2,2 UML時序圖複雜樣例

	```mermaid
	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: 沒人陪我玩
	```

2,3 UML標準時序圖樣例

	```mermaid
	%% 時序圖例子,-> 直線，-->虛線，->>實線箭頭
	  sequenceDiagram
	    participant 張三
	    participant 李四
	    張三->王五: 王五你好嗎？
	    loop 健康檢查
	        王五->王五: 與疾病戰鬥
	    end
	    Note right of 王五: 合理 食物 <br/>看醫生...
	    李四-->>張三: 很好!
	    王五->李四: 你怎麼樣?
	    李四-->王五: 很好!
	```

3，甘特圖

3,1 甘特圖樣例

	```mermaid
	gantt
	        dateFormat  YYYY-MM-DD
	        title 標題
	        section 現有任務
	        已完成               :done,    des1, 2014-01-06,2014-01-08
	        進行中               :active,  des2, 2014-01-09, 3d
	        計劃中               :         des3, after des2, 5d
	```

3,2 甘特圖複雜樣例

	```mermaid
	gantt
	        dateFormat  YYYY-MM-DD
	        title 軟件開發甘特圖
	        section 設計
	        需求                      :done,    des1, 2014-01-06,2014-01-08
	        原型                      :active,  des2, 2014-01-09, 3d
	        UI設計                     :         des3, after des2, 5d
	    未來任務                     :         des4, after des3, 5d
	        section 開發
	        學習準備理解需求                      :crit, done, 2014-01-06,24h
	        設計框架                             :crit, done, after des2, 2d
	        開發                                 :crit, active, 3d
	        未來任務                              :crit, 5d
	        耍                                   :2d
	        section 測試
	        功能測試                              :active, a1, after des3, 3d
	        壓力測試                               :after a1  , 20h
	        測試報告                               : 48h
	```