Mermaid中文文档

Appearance

架构图文档 (v11.1.0+) ​

在 mermaid-js 的上下文中，架构图用于显示云或 CI/CD 部署中常见服务和资源之间的关系。在架构图中，服务（节点）通过边连接。相关的服务可以放在组中，以便更好地说明它们的组织方式。

示例 ​

Code:
mermaid

语法 ​

架构的构建块是组、服务、边和连接点。

对于支持组件，图标通过用()括起图标名称来声明，而标签通过用[]括起文本进行声明。

要开始一个架构图，请使用关键字architecture-beta，后跟你的组、服务、边和连接点。虽然这三个构建块中的每一个都可以以任何顺序声明，但必须注意确保标识符先前已由另一个组件声明。

组 ​

声明组的语法如下：

group {组 ID}({图标名称})[{标题}] (in {父 ID})?

组合在一起：

group public_api(cloud)[Public API]

创建一个标识为public_api的组，使用图标cloud，并具有标签Public API。

此外，可以使用可选的in关键字将组放在组内

group private_api(cloud)[Private API] in public_api

服务 ​

声明服务的语法如下：

service {服务 ID}({图标名称})[{标题}] (in {父 ID})?

组合在一起：

service database1(database)[My Database]

创建标识为database1的服务，使用图标database，标签为My Database。

如果服务属于一个组，则可以通过可选的in关键字将其放在组内

service database1(database)[My Database] in private_api

边 ​

声明边的语法如下：

{服务Id}{{组}}?:{T|B|L|R} {<}?--{>}? {T|B|L|R}:{服务Id}{{组}}?

边方向 ​

边从服务的哪一侧出来由在连接到箭头的服务的一侧添加冒号 (:) 并添加 L|R|T|B 来指定。

例如：

db:R -- L:server

在服务db和server之间创建一条边，边从db的右边和server的左边出来。

db:T -- L:server

在服务db和server之间创建一条 90 度的边，边从db的顶部和server的左边出来。

箭头 ​

可以通过在左侧方向前添加<和/或在右侧方向后添加>来向边的每一侧添加箭头。

例如：

subnet:R --> L:gateway

创建一条箭头指向gateway服务的边

从组出来的边 ​

要让一条边从一个组到另一个组或另一个组内的服务，可以在serviceId之后添加 {group} 修饰符。

例如：

service server[Server] in groupOne
service subnet[Subnet] in groupTwo

server{group}:B --> T:subnet{group}

创建一条从groupOne（紧邻server）到groupTwo（紧邻subnet）的边。

需要注意的是，不能使用groupId来指定边，并且 {group} 修饰符只能用于组内的服务。

连接点 ​

连接点是一种特殊的节点类型，充当边之间潜在的四向分割。

声明连接点的语法如下：

junction {连接点 ID} (in {父 ID})?
Code:
mermaid

图标 ​

默认情况下，架构图支持以下图标：cloud、database、disk、internet、server。 用户可以使用 iconify.design 中提供的 200,000 多个图标中的任何一个，或者按照此处的步骤添加他们自己的自定义图标。

安装图标后，可以通过使用格式“name:icon-name”（其中 name 是注册图标包时使用的值）在架构图中使用它们。

Code:
mermaid