使用markmaid语言,在Typora中用mermaid画流程图和ER图

在markmaid中用mermaid画流程图和ER图


流程图方向有下面几个值

  • TB从上到下
  • BT从下到上
  • RL从右到左
  • LR从左到右
  • TD同TB

示例

从上到下

graph TD

A --> B
A B

从左到右

graph LR

A --> B
A B

基本图形

id + [文字描述] 矩形

  • id + (文字描述) 圆角矩形
  • id + > 文字描述] 不对称的矩形
  • id + {文字描述}菱形
  • id + ((文字描述))圆形

矩形 圆角矩形 不对成的矩形 菱形 圆形

节点之间的连接

A --> B A带箭头指向B

A --- B A不带箭头指向B
A -.- B A用虚线指向B
A -.-> B A用带箭头的虚线指向B
A ==> B A用加粗的箭头指向B
A -- 描述 --- B A不带箭头指向B并在中间加上文字描述
A -- 描述 --> B A带箭头指向B并在中间加上文字描述
A -. 描述 .-> B A用带箭头的虚线指向B并在中间加上文字描述
A == 描述 ==> B A用加粗的箭头指向B并在中间加上文字描述

描述 描述 描述 描述 A B A B A B A B A B A B A B A B A B

子流程图

subgraph title

graph definition

end
three one c2 c1 a2 a1

自定义样式

语法:style id 具体样式

示例
start stop

相关推荐
火星数据-Tina2 分钟前
如何构建一个支持多终端同步的体育比分网站?
大数据·前端·数据库·websocket
BD_Marathon3 分钟前
SpringMVC——5种类型参数传递
android·java·数据库
IT_陈寒5 分钟前
React 19 实战:5个新特性让你的开发效率提升50%!
前端·人工智能·后端
GuMoYu5 分钟前
el-date-picker限制选择范围
前端·javascript·vue.js
a31582380611 分钟前
Android 大图显示策略优化显示(二)
android·java·开发语言·javascript·kotlin·glide·图片加载
黛色正浓18 分钟前
leetCode-热题100-普通数组合集(JavaScript)
java·数据结构·算法
月明长歌22 分钟前
Java多线程线程池ThreadPoolExecutor理解总结:6 个核心参数 + 4 种拒绝策略(附完整示例)
java·开发语言
找不到、了23 分钟前
JVM 跨代引用与 Card Table 机制
java·jvm
sunywz25 分钟前
【JVM】(2)java类加载机制
java·jvm·python
冴羽26 分钟前
JavaScript Date 语法要过时了!以后用这个替代!
前端·javascript·node.js