mermaid 脚本语言

graph TB 从上到下
graph BT 从下到上
graph RL 从右到左
graph LR 从左到右

graph LR;

A001-->B001;

graph LR;
A001-->B001;

graph TB;

C001-->D001;

graph TB;
C001-->D001;

graph TB;

A[001]-->B[111];

A--->C[003];

graph TB;
A[001]-->B[111];
A--->C[003];
-->  实线箭头
--- 实线
-.- 虚线
-.-> 虚线箭头
graph LR;
A[吃早餐]-->B[牛奶];
A---B[热的];
graph LR;
A[吃早餐]-.-B[煎饼];
A-.->C;
C[牛奶]---D[脱脂牛奶];
B---E[不加鸡蛋];
D-.->F[吃饱了];
E-.->F[吃饱了];
graph LR;
A[吃早餐]-.-B[煎饼];
A-.->C;
C[牛奶]---D[脱脂牛奶];
B---E[不加鸡蛋];
D-.->F[吃饱了];
E-.->F[吃饱了];
绘制网络拓扑图
[内容] 矩形
{内容} 菱形
(内容) 圆弧形
>内容] 非对称
((内容)) 圆形
graph TB;
0{设备联网流程图}
A(添加设备)-->B>连接线缆];
B-->C0((PC配置));
graph TB;
0{设备联网流程图}
A(添加设备)-->B>连接线缆];
B-->C0((PC配置));
flowchart
连线为弧形
flowchart TB;
0{设备联网流程图}
A(添加设备)-->B>连接线缆];
B-->C0((PC配置));
flowchart TB;
0{设备联网流程图}
A(添加设备)-->B>连接线缆];
A-->D[123];
B-->C0((PC配置));
|内容|:将内容显示在连线上
flowchart TB;
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-->存储服务
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-->存储服务

mermaid语法画图的更多相关文章

  1. mermaid 语法

    a:focus { outline: thin dotted #333; outline: 5px auto -webkit-focus-ring-color; outline-offset: -2p ...

  2. 使用Mermaid画图

    流程图的示例 时序图的示例 甘特图的示例 FAQ 很多时候,你想解释自己的想法/代码,但是用语言来表达会很啰嗦,并且读者也不易理解.一般这种情况下,我们都会想使用图解来解释.但是,我们也不会想下载那些 ...

  3. Markdown画图(mermaid)学习

    简介 目前博客园支持mermaid的graph,subgraph,sequenceDiagram,gantt,classDiagram mermaid(美人鱼), 是一个类似markdown,用文本语 ...

  4. Markdown语法说明及测试一览表

    标题: Markdown语法说明及测试一览表 作者: 梦幻之心星 347369787@QQ.com 标签: [Markdown, Typora, Markdown_Nice, CSS] 目录: [Ma ...

  5. Hexo引入Mermaid流程图和MathJax数学公式

    近来用Markdown写文章,越来越不喜欢插入图片了,一切能用语法解决的问题坚决不放图,原因有二: 如果把流程图和数学公式都以图片方式放到文章内,当部署到Github上后,访问博客时图片加载实在太慢, ...

  6. markdown syntax

    Markdown 语法 转载自https://zh.mweb.im/markdown.html 首先应该了解的 每一个 Markdwon 使用者都应该了解的,是 Markdown 最基本的版本,也就是 ...

  7. aha

    欢迎使用 MWeb MWeb 是专业的 Markdown 写作.记笔记.静态博客生成软件,目前已支持 Mac,iPad 和 iPhone.MWeb 有以下特色: 软件本身: 使用原生的 macOS 技 ...

  8. UML建模语言、设计原则、设计模式

    1.UML统一建模语言 定义:用于软件系统设计与分析的语言工具 目的:帮助开发人员更好的梳理逻辑.思路 学习地址:UML概述_w3cschool 官网:https://www.omg.org/spec ...

  9. 新版CSDN-markdown编辑器使用指南

    本文来自CSDN官方,分markdown原文和实际显示部分,推荐开两个窗口对比浏览 Markdown部分 @[TOC](这里写自定义目录dd标题) # 欢迎使用Markdown编辑器 你好! 这是你第 ...

  10. CSDN新版Markdown编辑器(Alpha 2.0版)使用示例(文首附源码.md文件)

    CSDN新版Markdown编辑器(Alpha 2.0版) 使用示例 附 本文的Markdown源码: https://github.com/yanglr/AlgoSolutions/blob/mas ...

随机推荐

  1. go-zero goctl命令图解

  2. docker-compose 安装redis

    一. docker 拉去最新版本的redis `docker pull redis:6.0.6` #后面可以带上tag号, 默认拉取最新版本 二. docker安装redis 执行命令: mkdir ...

  3. vue安装tinyMCE

    目录 [参考视频] [参考文章] 官网: https://www.tiny.cloud/auth/signup/ 资源下载 tinymce 官方为 vue 项目提供了一个组件tinymce-vue n ...

  4. keepalived(3)- keepalived+nginx实现WEB负载均衡高可用集群

    目录 1. keepalived+nginx实现WEB负载均衡高可用集群 1.1 需求和环境描述 1.2 WEB集群部署 1.3 负载均衡集群部署 1.4 keepalived部署 1.5 测试监控的 ...

  5. Consul启动闪退

    一.问题概述 在Windows10下载了consul,解压完后,点击consul.exe出现闪退,其实闪退也不影响使用 二.解决方案 方案1: 按理说第一种方法就可以解决问题:在环境变量的系统变量中的 ...

  6. Javascript返回顶部和砸金蛋,跑马灯等游戏代码实现

    1. 我们经常写页面的时候会遇到页面很长需要做返回顶部的操作:$("id /class").animate({scrollTop:$('.class').offset().top} ...

  7. 启动vite和electron项目配置多个主进程

    推荐 concurrently 点击查看代码 "dev": "concurrently \"nodemon --exec electron . \" ...

  8. zabbix使用

    安装部署6.0版本 获取仓库 https://www.zabbix.com/cn/download?zabbix=6.0&os_distribution=centos&os_versi ...

  9. python计算机视觉学习笔记——PIL库的用法

    如果需要处理的原图及代码,请移步小编的GitHub地址 传送门:请点击我 如果点击有误:https://github.com/LeBron-Jian/ComputerVisionPractice 这个 ...

  10. .NET Framework 4.7.2下 Hangfire 的集成

    参考资料: 开源的.NET定时任务组件Hangfire解析:https://www.cnblogs.com/pengze0902/p/6583119.html.Net Core 简单的Hangfire ...