Python data mining and text analysis & Stata application ability improvement and empirical frontier cloud training~
Mermaid can draw charts and flowcharts in text mode, which is more lightweight and convenient than Visio. In addition, Markdown internally supports Mermaid syntax, which can effectively avoid switching software and let us focus more on the content itself.
mermaid official document
https://mermaid-js.github.io/mermaid/#/README
Chart type support
-
Pie Chart
-
Flow Chart
-
Sequence Diagram (Sequence Diagram)
-
State Diagram
-
Gantt Diagram
-
Class diagram
- and many more
Pie chart
Pie chart is a chart we often use. It is the simplest in mermaid, basically it can be seen at a glance
Code
pie
title Pets adopted by volunteers
"Dogs" : 386
"Cats" : 85
"Rats" : 15
``
用到的关键词
![](https://s4.51cto.com/images/blog/202012/30/74bb08c25ed1da93f53dfbdb3ce98ce3.png?x-oss-process=image/watermark,size_16,text_QDUxQ1RP5Y2a5a6i,color_FFFFFF,t_100,g_se,x_10,y_10,shadow_90,type_ZmFuZ3poZW5naGVpdGk=)
**流程图**
![](https://s4.51cto.com/images/blog/202012/30/281dc49b4ebc4b539e7877ce21a5eb50.png?x-oss-process=image/watermark,size_16,text_QDUxQ1RP5Y2a5a6i,color_FFFFFF,t_100,g_se,x_10,y_10,shadow_90,type_ZmFuZ3poZW5naGVpdGk=)
该流程图就是用下方的代码再markdown中实现的
graph RL;
A-->B;
A-->C;
B-->D;
C-->D;
关键词解读
![](https://s4.51cto.com/images/blog/202012/30/b499ff347622840acb18daef90b45e42.png?x-oss-process=image/watermark,size_16,text_QDUxQ1RP5Y2a5a6i,color_FFFFFF,t_100,g_se,x_10,y_10,shadow_90,type_ZmFuZ3poZW5naGVpdGk=)
节点还可以用:::调用修饰函数,如下
![](https://s4.51cto.com/images/blog/202012/30/e9af8b8637b650eb802a2c7338803cff.png?x-oss-process=image/watermark,size_16,text_QDUxQ1RP5Y2a5a6i,color_FFFFFF,t_100,g_se,x_10,y_10,shadow_90,type_ZmFuZ3poZW5naGVpdGk=)
graph LR
A:::someclass --> B
classDef someclass fill:#f96;
**时序图**
![](https://s4.51cto.com/images/blog/202012/30/73bb68e7ddf3d249efbbfe3c80b56999.png?x-oss-process=image/watermark,size_16,text_QDUxQ1RP5Y2a5a6i,color_FFFFFF,t_100,g_se,x_10,y_10,shadow_90,type_ZmFuZ3poZW5naGVpdGk=)
时序图用于描述对象之间的传递消息的时间顺序, 即用例中的行为顺序. 顺序图稍微复杂了一丢丢,代码如下
sequenceDiagram
participant Alice
participant Bob
participant John
Alice->>John: Hello John, how are you?
loop Healthcheck
John->>John: Fight against hypochondria
end
Note right of John: Rational thoughts <br/>prevail!
John-->>Alice: Great!
John->>Bob: How about you?
Bob-->>John: Jolly good!
用到的关键词
![](https://s4.51cto.com/images/blog/202012/30/764afd969c944bc8f6c436b151ea0dc1.png?x-oss-process=image/watermark,size_16,text_QDUxQ1RP5Y2a5a6i,color_FFFFFF,t_100,g_se,x_10,y_10,shadow_90,type_ZmFuZ3poZW5naGVpdGk=)
**状态图**
通过建立对象的生存周期模型来描述对象随时间变化的动态行为
![](https://s4.51cto.com/images/blog/202012/30/43edc0620ed4c342c5178680b649a51c.png?x-oss-process=image/watermark,size_16,text_QDUxQ1RP5Y2a5a6i,color_FFFFFF,t_100,g_se,x_10,y_10,shadow_90,type_ZmFuZ3poZW5naGVpdGk=)
代码
stateDiagram
Start --> First
First --> Second
First --> Third
Second --> End
Third --> End
state First {
[*] --> fir
fir --> [*]
}
state Second {
[*] --> sec
sec --> [*]
}
state Third {}
代码关键词解读
![](https://s4.51cto.com/images/blog/202012/30/e3077826ba8b0b543ebc9794f6babf4e.png?x-oss-process=image/watermark,size_16,text_QDUxQ1RP5Y2a5a6i,color_FFFFFF,t_100,g_se,x_10,y_10,shadow_90,type_ZmFuZ3poZW5naGVpdGk=)
**甘特图**
![](https://s4.51cto.com/images/blog/202012/30/c5e79ecbc49a5417da4fbf497b0b2999.png?x-oss-process=image/watermark,size_16,text_QDUxQ1RP5Y2a5a6i,color_FFFFFF,t_100,g_se,x_10,y_10,shadow_90,type_ZmFuZ3poZW5naGVpdGk=)
代码如下
gantt
dateFormat YYYY-MM-DD
title Adding GANTT diagram to mermaid
excludes weekdays 2014-01-10
section A section
Completed task :done, des1, 2014-01-06,2014-01-08
Active task :active, des2, 2014-01-09, 3d
Future task : des3, after des2, 5d
Future task2 : des4, after des3, 5d
用到的关键词
![](https://s4.51cto.com/images/blog/202012/30/4e11cd77fb0db626ea57cc0b04ffb8a2.png?x-oss-process=image/watermark,size_16,text_QDUxQ1RP5Y2a5a6i,color_FFFFFF,t_100,g_se,x_10,y_10,shadow_90,type_ZmFuZ3poZW5naGVpdGk=)
**class类图**
面向对象的编程会经常看到类,类与类有所属关系。比如中国人是人类的一员,而人类又隶属于灵长类动物。
![](https://s4.51cto.com/images/blog/202012/30/f95d1db5756557fe693fa996b7c332ac.png?x-oss-process=image/watermark,size_16,text_QDUxQ1RP5Y2a5a6i,color_FFFFFF,t_100,g_se,x_10,y_10,shadow_90,type_ZmFuZ3poZW5naGVpdGk=)
代码
classDiagram
Animal <|-- Duck
Animal <|-- Fish
Animal <|-- Zebra
Animal : int age
Animal : String gender
Animal: isMammal()
Animal: mate()
class Duck{
String beakColor
swim()
quack()
}
class Fish{
int sizeInFeet
canEat()
}
class Zebra{
bool is_wild
run()
eat()
}
用到的关键词
![](https://s4.51cto.com/images/blog/202012/30/212f28dbb6936d507ca3af5fb7223d2f.png?x-oss-process=image/watermark,size_16,text_QDUxQ1RP5Y2a5a6i,color_FFFFFF,t_100,g_se,x_10,y_10,shadow_90,type_ZmFuZ3poZW5naGVpdGk=)
大家如果熟悉Python,就能理解类的属性和方法区别就是是否有括号。