架构图文档 (v11.1.0+)

在 mermaid-js 的语境下，架构图用于展示云或 CI/CD 部署中常见的服务和资源之间的关系。在一个架构图中，服务（节点）通过边连接。相关的服务可以放置在组内，以便更好地说明它们是如何组织的。

示例

语法

架构图的基本构建块是 groups、services、edges 和 junctions。

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

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

组

声明组的语法为

group {group id}({icon name})[{title}] (in {parent id})?

组合在一起

group public_api(cloud)[Public API]

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

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

group private_api(cloud)[Private API] in public_api

服务

声明服务的语法为

service {service id}({icon name})[{title}] (in {parent id})?

组合在一起

service database1(database)[My Database]

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

如果服务属于某个组，则可以使用可选的 in 关键字将其放置在该组内

service database1(database)[My Database] in private_api

边

声明边的语法为

{serviceId}{{group}}?:{T|B|L|R} {<}?--{>}? {T|B|L|R}:{serviceId}{{group}}?

边方向

边从服务的哪一侧出来，是通过在连接到箭头服务的侧面添加一个冒号 (:)，以及添加 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} 修饰符只能用于组内的服务。

连接

连接是一种特殊的节点，充当边之间潜在的 4 路分叉。

声明连接的语法为

junction {junction id} (in {parent id})?

图标

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

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