使用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

相关推荐
LYFlied1 天前
在AI时代,前端开发者如何构建全栈开发视野与核心竞争力
前端·人工智能·后端·ai·全栈
用户47949283569151 天前
我只是给Typescript提个 typo PR,为什么还要签协议?
前端·后端·开源
Surpass余sheng军1 天前
AI 时代下的网关技术选型
人工智能·经验分享·分布式·后端·学习·架构
JosieBook1 天前
【Spring Boot】Spring Boot调用 WebService 接口的两种方式:动态调用 vs 静态调用 亲测有效
java·spring boot·后端
a程序小傲1 天前
京东Java面试被问:Spring拦截器和过滤器区别
java·面试·京东云·java八股文
程序员爱钓鱼1 天前
Next.js SSR 项目生产部署全攻略
前端·next.js·trae
程序员爱钓鱼1 天前
使用Git 实现Hugo热更新部署方案(零停机、自动上线)
前端·next.js·trae
颜颜yan_1 天前
DevUI + Vue 3 入门实战教程:从零构建AI对话应用
前端·vue.js·人工智能
2401_871260021 天前
Java学习笔记(二)面向对象
java·python·学习
国服第二切图仔1 天前
DevUI Design中后台产品开源前端解决方案之Carousel 走马灯组件使用指南
前端·开源