C4 图表
C4 图：目前这是一个实验性的图表。语法和属性在未来的版本中可能会发生变化。当语法稳定时，将提供适当的文档。
Mermaid的C4图表语法与plantUML兼容。请参见以下示例：
例如，请参见源代码演示/demos/index.html
支持5种类型的C4图表。
- 系统上下文 (C4Context)
- 容器图 (C4Container)
- 组件图 (C4Component)
- 动态图 (C4Dynamic)
- 部署图 (C4Deployment)
请参考链接文档C4-PlantUML语法了解如何编写C4图。
C4图是固定样式，例如CSS颜色，因此在不同皮肤下不提供不同的CSS。updateElementStyle和UpdateElementStyle在图表的最后部分编写。updateElementStyle与原始定义不一致，并更新关系的样式，包括文本标签相对于原始位置的偏移量。
布局不使用完全自动化的布局算法。形状的位置通过改变语句的书写顺序来调整。因此，没有计划支持以下布局语句。每行的形状数量和边界数量可以使用UpdateLayoutConfig进行调整。
- 布局
- Lay_U, Lay_Up
- Lay_D, Lay_Down
- Lay_L, Lay_Left
- Lay_R, Lay_Right
以下未完成的功能在短期内不受支持。
[ ] 精灵
[ ] 标签
[ ] 链接
[ ] 图例
[x] 系统上下文
- [x] Person(alias, label, ?descr, ?sprite, ?tags, $link)
- [x] Person_Ext
- [x] System(alias, label, ?descr, ?sprite, ?tags, $link)
- [x] SystemDb
- [x] SystemQueue
- [x] System_Ext
- [x] SystemDb_Ext
- [x] SystemQueue_Ext
- [x] Boundary(alias, label, ?type, ?tags, $link)
- [x] Enterprise_Boundary(alias, label, ?tags, $link)
- [x] System_Boundary
[x] 容器图
- [x] Container(alias, label, ?techn, ?descr, ?sprite, ?tags, $link)
- [x] ContainerDb
- [x] ContainerQueue
- [x] Container_Ext
- [x] ContainerDb_Ext
- [x] ContainerQueue_Ext
- [x] Container_Boundary(alias, label, ?tags, $link)
[x] 组件图
- [x] Component(alias, label, ?techn, ?descr, ?sprite, ?tags, $link)
- [x] ComponentDb
- [x] ComponentQueue
- [x] Component_Ext
- [x] ComponentDb_Ext
- [x] ComponentQueue_Ext
[x] 动态图表
- [x] RelIndex(index, from, to, label, ?tags, $link)
[x] 部署图
- [x] Deployment_Node(alias, label, ?type, ?descr, ?sprite, ?tags, $link)
- [x] Node(alias, label, ?type, ?descr, ?sprite, ?tags, $link): Deployment_Node() 的简称
- [x] Node_L(alias, label, ?type, ?descr, ?sprite, ?tags, $link): 左对齐的 Node()
- [x] Node_R(alias, label, ?type, ?descr, ?sprite, ?tags, $link): 右对齐的 Node()
[x] 关系类型
- [x] Rel(from, to, label, ?techn, ?descr, ?sprite, ?tags, $link)
- [x] BiRel (双向关系)
- [x] Rel_U, Rel_Up
- [x] Rel_D, Rel_Down
- [x] Rel_L, Rel_Left
- [x] Rel_R, Rel_Right
- [x] Rel_Back
- [x] RelIndex * 与C4-PlantUML语法兼容，但忽略索引参数。序号由rel语句的书写顺序决定。
[ ] 自定义标签/原型支持和皮肤参数更新
- [ ] AddElementTag(tagStereo, ?bgColor, ?fontColor, ?borderColor, ?shadowing, ?shape, ?sprite, ?techn, ?legendText, ?legendSprite): 引入一个新的元素标签。标记元素的样式将被更新，并且该标签将显示在计算出的图例中。
- [ ] AddRelTag(tagStereo, ?textColor, ?lineColor, ?lineStyle, ?sprite, ?techn, ?legendText, ?legendSprite): 引入一个新的关系标签。标记关系的样式将被更新，并且该标签将显示在计算出的图例中。
- [x] UpdateElementStyle(elementName, ?bgColor, ?fontColor, ?borderColor, ?shadowing, ?shape, ?sprite, ?techn, ?legendText, ?legendSprite): 此调用更新元素的默认样式（组件等），并且不会创建额外的图例条目。
- [x] UpdateRelStyle(from, to, ?textColor, ?lineColor, ?offsetX, ?offsetY): 此调用更新关系的默认颜色，并且不会创建额外的图例条目。新增了两个参数，offsetX 和 offsetY，用于设置文本原始位置的偏移量。
- [ ] RoundedBoxShape(): 此调用返回圆角矩形形状的名称，并可用作 ?shape 参数。
- [ ] EightSidedShape(): 此调用返回八边形形状的名称，并可用作 ?shape 参数。
- [ ] DashedLine(): 此调用返回虚线名称，并可用作 ?lineStyle 参数。
- [ ] DottedLine(): 此调用返回点线名称，并可用作 ?lineStyle 参数。
- [ ] BoldLine(): 此调用返回粗线名称，并可用作 ?lineStyle 参数。
- [x] UpdateLayoutConfig(?c4ShapeInRow, ?c4BoundaryInRow): 新增。此调用更新默认的 c4ShapeInRow(4) 和 c4BoundaryInRow(2)。
有两种方法可以分配带有问号的参数。一种按照参数的顺序使用非命名参数分配方法，另一种使用命名参数分配方法，其中名称必须以$符号开头。
示例：UpdateRelStyle(from, to, ?textColor, ?lineColor, ?offsetX, ?offsetY)
UpdateRelStyle(customerA, bankA, "red", "blue", "-40", "60")
UpdateRelStyle(customerA, bankA, $offsetX="-40", $offsetY="60", $lineColor="blue", $textColor="red")
UpdateRelStyle(customerA, bankA, $offsetY="60")