对于程序员来说,Markdown是最常用的语言了,但是一直以来markdown都没有提供思维导图的功能,需要使用思维导图软件编辑以后以图片的形式插入到markdown文档中,难以实现一站式的编辑体验。
现在Markdown也可以支持思维导图啦,依赖于使用Mermaid代码块来实现。
Mermaid支持各种图形:
- 流程图
- 序列化
- 甘特图
- 类图
- Git图
- 用户旅程图
- ......
以类图为例,Mermaid代码块如下:
classDiagram Class01 <|-- AveryLongClass : Cool Class03 *-- Class04 Class05 o-- Class06 Class07 .. Class08 Class09 --> C2 : Where am i? Class09 --* C3 Class09 --|> Class07 Class07 : equals() Class07 : Object[] elementData Class01 : size() Class01 : int chimp Class01 : int gorilla Class08 <--> C2: Cool label
展示出来的图形如下:
以序列图为例,Mermaid代码块如下:
sequenceDiagram participant Alice participant Bob 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!
以思维导图为例,Mermaid代码块如下:
graph LR A[Spring]-->B[Spring Boot] A-->C[Spring Cloud] A-->D[Spring Data] B-->E[Spring Boot 1.x] B-->F[Spring Boot 2.x] C-->H[Spring Cloud Netflix] C-->I[Spring Cloud Alibaba] D-->J[Spring Data Redis] D-->K[Spring Data MQ]