Mermaid对齐子图
我有一个类,用来测试因竞态条件导致的双插入操作。这确实需要一个好的解释,所以我转向了Mermaid:
flowchart TD
A(Process start) --> B(Acquire target lock)
B --> C{Create race condition}
subgraph Left[Parent]
D(Wait)
E(SELECT)
F(FALSE)
G(INSERT)
D --> E --> |delay| F --> G
end
subgraph Right[Child]
M(Run to acquire target lock)
N(SELECT)
O(FALSE)
P(INSERT)
M --> N --> |delay| O --> P
end
C --> D
C --> M
M -->|signal ready| D
这不错,但还不够理想。我希望C-->D和 C-->M的箭头是水平的,并且从 C 的顶点出发,而不是从边的端点,然后向下转成90度的转弯,接着父节点和子节点的块应该对齐。
解决方案
我设法添加了一个节点,使父节点和子节点块对齐,同时还添加了一对没有具体形状的节点,允许从C 的顶点出发的90度转弯。不过在编辑器中开启自动布局会改变图形。希望这对你有帮助:
---
config:
layout: fixed
---
flowchart TB
subgraph Left["Parent"]
D("Wait")
E("SELECT")
F("FALSE")
G("INSERT")
end
subgraph Right["Child"]
M("Run to acquire target lock")
N("SELECT")
O("FALSE")
P("INSERT")
end
A("Process start") --> B("Acquire target lock")
B --> C{"Create race condition"}
D --> E
E -- delay --> F
F --> G
M --> N
M --- n1["signal ready"]
N -- delay --> O
O --> P
C --- n2["Null"] & n3["Null"]
n1 --> D
n2 --> Right
n3 --> Left
n2@{ shape: anchor}
n3@{ shape: anchor}
style n1 stroke-width:0px,stroke-dasharray:0,fill:#CCCCCC
style n3 fill:#000000
站内所有文章版权归属LeftHeroAI导航站,无授权禁止任何主体转载、抄袭、复制内容,亦不得私自架设镜像站点。一经侵权,本站将通过法律途径追责。