mermaid 语法留存

后语

1.CSDN时序图的mermaid画法

画类图和时序图,注意时序图是把发信息的人的主语抽离。就好像这个
我:Hello , can you speak chinese?
小明:yes
我 :where 's the ZhongShanPark?
小明:i don’t know ,maybe you can ask others
我:Hello,can you speak chinese?
小王:yes
我:where’s the ZhongshanPark
小王:oh,it’s in XXX

小强 小明 askCanYouSpeakQuestion() letHimKnowTheWay() letHimAskAnotherOne() alt [知道] [不知道] askWhereQuestion() letHimKnowTheWay() letHimAskAnotherOne() alt [知道] [不知道] 小强 小明 测试

注意到了这个是不停的重复代码,可以适当抽象进行复用

其他人 askCanYouSpeakQuestion() 这里是个边界备注. letHimKnowTheWay() letHimAskAnotherOne() alt [知道] [不知道] askWhereQuestion() letHimKnowTheWay() letHimAskAnotherOne() alt [知道] [不知道] loop [Every people] 其他人 测试

这个时序图的CSDN mermaid 代码

```mermaid
sequenceDiagram
Title: 测试
participant A as 我
participant B as 其他人

loop Every people
	activate A
	A->>B : askCanYouSpeakQuestion()
	Note right of B: 这里是个边界备注.
	activate B
 	alt  知道
	       B-->>A: letHimKnowTheWay()
	   else 不知道
	       B-->>A: letHimAskAnotherOne()
	   end
	A->>B:askWhereQuestion()
	
	alt  知道
	      B-->>A: letHimKnowTheWay()
	  else 不知道
	      B-->>A: letHimAskAnotherOne()
	  end
	  deactivate B
	  deactivate A
end

参考:https://mermaidjs.github.io/sequenceDiagram.html

2.CSDN流程图的mermaid代码

流程图基础参考迂者-贺利坚blog
在这里插入图片描述
https://mermaidjs.github.io/flowchart.html
我们把askWhereQuestion进行更细分

main
ask
getQuestionNumberBy Id
YES
NO
paramIsVlidate
define questionNumber,dictory,id
data = getQuestionNumberBy Id
runSql
data is null ?
dataIsValidate data
return dictory is not find
run data
perpareSearchParam

marmaid代码
GQNB_1= getQuestionNumberById _1
A_1 = ask_1 别名
M_1 = main_1 别名

```mermaid
graph TB

    subgraph getQuestionNumberById
    GQNB_1[paramIsVlidate]-->GQNB_2[perpareSearchParam]
    GQNB_2-->GQNB_3[runSql]
    end
    
    subgraph ask
    A_1[dataIsValidate data]-->A_2[run data]
    end
    
   subgraph main
    M_1[define questionNumber,dictory,id]-->GQNB_1[call getQuestionNumberById id]

    GQNB_3-->M_3(data = getQuestionNumberById)
    M_3-->M_4{data is null ?}
    M_4-->|YES|A_1

    M_4-->|NO|M_5[return dictory is not find]
    end
    
    

甘特图

Mon 06 Mon 13 Mon 20 Completed task Active task Future task Future task2 Completed task in the critical line Implement parser and jison Create tests for parser Future task in critical line Create tests for renderer Add to mermaid Describe gantt syntax Add gantt diagram to demo page Add another diagram to demo page Describe gantt syntax Add gantt diagram to demo page Add another diagram to demo page A section Critical tasks Documentation Last section Adding GANTT diagram functionality to mermaid
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值