Markdown画图

简介: Markdown画图

对于程序员来说,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]

相关文章
|
5月前
|
Python
如何用PYTHON代码编辑gif,正方形变圆形
需要注意的是,这个示例考虑到了GIF的循环播放和帧间持续时间,以确保输出的GIF在视觉上与原始GIF尽可能一致。然而,根据你的特定需求,你可能还需要做进一步的调整或优化。
60 5
|
4月前
|
资源调度
Markdown 数学公式
Markdown 数学公式
45 0
|
4月前
|
uml
markdown之mermaid
markdown之mermaid
|
6月前
|
Python
【随手记】贴一段matplotlib绘图的多图拼接代码
【随手记】贴一段matplotlib绘图的多图拼接代码
59 1
markdown编写数学公式
在计算机这一块,我们肯定会接触到数学,数学中又包含很多公式,但是到现在,手写这些公式应该不陌生,但是如果让你电脑敲出来,你绝对很懵逼,这也造成了我们有时候写笔记时一些公式没办法在电脑上像我们手写一样灵活,今天在这里分享给大家使用markdown描述公式的语法
362 1
markdown编写数学公式
使用Markdown编写数学公式的简易指南
Markdown是一种轻量级的标记语言,广泛用于撰写文档、博客和学术论文。在数学领域,有时需要插入数学公式以便更清晰地表达思想。本文将介绍如何在Markdown中轻松地编写数学公式,使你的文本更具可读性和专业性。
547 1
|
机器学习/深度学习 资源调度
markdown 常用数学公式
markdown 常用数学公式
113 0
【Latex】Jupyter/Markdown/Latex快速编辑高大上数学公式/常见希腊字母
【Latex】Jupyter/Markdown/Latex快速编辑高大上数学公式/常见希腊字母
176 0
|
数据可视化 JavaScript 前端开发
【Mermaid】画图工具使用笔记
【Mermaid】画图工具使用笔记
231 0