mermaid语法画图
mermaid 脚本语言
graph TB 从上到下
graph BT 从下到上
graph RL 从右到左
graph LR 从左到右
graph LR;
A001-->B001;
A001-->B001;
graph TB;
C001-->D001;
C001-->D001;
graph TB;
A[001]-->B[111];
A--->C[003];
A[001]-->B[111];
A--->C[003];
--> 实线箭头
--- 实线
-.- 虚线
-.-> 虚线箭头
A[吃早餐]-->B[牛奶];
A---B[热的];
graph LR;
A[吃早餐]-.-B[煎饼];
A-.->C;
C[牛奶]---D[脱脂牛奶];
B---E[不加鸡蛋];
D-.->F[吃饱了];
E-.->F[吃饱了];
A[吃早餐]-.-B[煎饼];
A-.->C;
C[牛奶]---D[脱脂牛奶];
B---E[不加鸡蛋];
D-.->F[吃饱了];
E-.->F[吃饱了];
绘制网络拓扑图
[内容] 矩形
{内容} 菱形
(内容) 圆弧形
>内容] 非对称
((内容)) 圆形
graph TB;
0{设备联网流程图}
A(添加设备)-->B>连接线缆];
B-->C0((PC配置));
0{设备联网流程图}
A(添加设备)-->B>连接线缆];
B-->C0((PC配置));
flowchart
连线为弧形
flowchart TB;
0{设备联网流程图}
A(添加设备)-->B>连接线缆];
B-->C0((PC配置));
0{设备联网流程图}
A(添加设备)-->B>连接线缆];
A-->D[123];
B-->C0((PC配置));
|内容|:将内容显示在连线上
0{设备联网流程图}
A(添加设备)-->|你好|B>连接线缆];
A-->D[123];
B-->C0((PC配置));
subgraph:定义子模块
flowchart LR;
subgraph 调度服务
1(192.168.121.1)---|高可用|2(192.168.121.111)
end
subgraph web服务
3(192.168.22.12)
4(192.168.121.14)
5(192.168.121.66)
end
subgraph 存储服务
6{192.168.121.88}---|高可用|7{192.168.121.99}
end
用户-->调度服务-->3 & 4 & 5-->存储服务
subgraph 调度服务
1(192.168.121.1)---|高可用|2(192.168.121.111)
end
subgraph web服务
3(192.168.22.12)
4(192.168.121.14)
5(192.168.121.66)
end
subgraph 存储服务
6{192.168.121.88}---|高可用|7{192.168.121.99}
end
用户-->调度服务-->3 & 4 & 5-->存储服务
mermaid语法画图的更多相关文章
- mermaid 语法
a:focus { outline: thin dotted #333; outline: 5px auto -webkit-focus-ring-color; outline-offset: -2p ...
- 使用Mermaid画图
流程图的示例 时序图的示例 甘特图的示例 FAQ 很多时候,你想解释自己的想法/代码,但是用语言来表达会很啰嗦,并且读者也不易理解.一般这种情况下,我们都会想使用图解来解释.但是,我们也不会想下载那些 ...
- Markdown画图(mermaid)学习
简介 目前博客园支持mermaid的graph,subgraph,sequenceDiagram,gantt,classDiagram mermaid(美人鱼), 是一个类似markdown,用文本语 ...
- Markdown语法说明及测试一览表
标题: Markdown语法说明及测试一览表 作者: 梦幻之心星 347369787@QQ.com 标签: [Markdown, Typora, Markdown_Nice, CSS] 目录: [Ma ...
- Hexo引入Mermaid流程图和MathJax数学公式
近来用Markdown写文章,越来越不喜欢插入图片了,一切能用语法解决的问题坚决不放图,原因有二: 如果把流程图和数学公式都以图片方式放到文章内,当部署到Github上后,访问博客时图片加载实在太慢, ...
- markdown syntax
Markdown 语法 转载自https://zh.mweb.im/markdown.html 首先应该了解的 每一个 Markdwon 使用者都应该了解的,是 Markdown 最基本的版本,也就是 ...
- aha
欢迎使用 MWeb MWeb 是专业的 Markdown 写作.记笔记.静态博客生成软件,目前已支持 Mac,iPad 和 iPhone.MWeb 有以下特色: 软件本身: 使用原生的 macOS 技 ...
- UML建模语言、设计原则、设计模式
1.UML统一建模语言 定义:用于软件系统设计与分析的语言工具 目的:帮助开发人员更好的梳理逻辑.思路 学习地址:UML概述_w3cschool 官网:https://www.omg.org/spec ...
- 新版CSDN-markdown编辑器使用指南
本文来自CSDN官方,分markdown原文和实际显示部分,推荐开两个窗口对比浏览 Markdown部分 @[TOC](这里写自定义目录dd标题) # 欢迎使用Markdown编辑器 你好! 这是你第 ...
- CSDN新版Markdown编辑器(Alpha 2.0版)使用示例(文首附源码.md文件)
CSDN新版Markdown编辑器(Alpha 2.0版) 使用示例 附 本文的Markdown源码: https://github.com/yanglr/AlgoSolutions/blob/mas ...
随机推荐
- MySQL的索引优化
一.索引的使用场景 1.全值匹配 通过主键索引查询 mysql> explain select * from t_goods where id = 1 \G; ***************** ...
- echarts下划线实现
echarts中无下划线实现,我采用图片填充文本块背景的方式实现 这是从 长空雁叫霜晨月 的博客中得到启发https://www.cnblogs.com/volodya/p/Echarts.html ...
- 自动化部署elasticsearch三节点集群
什么是Elasticsearch? Elasticsearch 是一个开源的分布式搜索和分析引擎,构建在 Apache Lucene 的基础上.它提供了一个分布式多租户的全文搜索引擎,具有实时分析功能 ...
- linux wget命令的重要用法:下载文件并保存,后台下载
Linux wget命令是一个下载文件的工具,它用在命令行下. #从网络下载一个文件并保存在当前目录 [root@node5 ~]# wget http://cn.wordpress.org/word ...
- java 项目的创建
新建一个 Spring Initializr
- Swoole 实践篇之结合 WebRTC 实现音视频实时通信方案
原文首发链接:Swoole 实践篇之结合 WebRTC 实现音视频实时通信方案 大家好,我是码农先森. 引言 这次实现音视频实时通信的方案是基于 WebRTC 技术的,它是一种点对点的通信技术,通过浏 ...
- Android OpenMAX(八)如何学习OMXNodeInstance
前面一篇文章中我们看到media.codec service创建OMX组件后会把组件传递给一个OMXNodeInstance对象,并且把OMXNodeInstance对象返回到Framework层,F ...
- 自动化测试在 Kubernetes Operator 开发中的应用:以 OpenTelemetry 为例
背景 最近在给 opentelemetry-operator提交一个标签选择器的功能时,因为当时修改的函数是私有的,无法添加单测函数,所以社区建议我补充一个 e2e test. 因为在当前的版本下,只 ...
- conda错误 创建新环境conda create -n TF117 python=3.5时报错 An unexpected error has occurred. Conda has prepared the above report.
创建新环境conda create -n TF117 python=3.5时报错 An unexpected error has occurred. Conda has prepared the ab ...
- python-去掉写入csv文件的多余的一行空白行
如执行下面的代码: 1 import csv 2 3 if __name__ == "__main__": 4 5 content1 = ['hello'] 6 content2 ...