Closed3
mermaid 記法メモ
ピン留めされたアイテム
とにかく記法を一覧でさっと探したいときのためのメモ
Flowchart
direction
Direction | name |
---|---|
top to bottom | TB |
top-down / same as top to bottom | TD |
bottom to top | BT |
right to left | RL |
left to right | LR |
よく使うのは TD
, LR
TB
と TD
は似てるが、フローチャートによっては結構違う並びになる。
node text
id1[the text in the box]
id2["the (text) in the box"]
node shapes
Type | example |
---|---|
normal | id[the text in the box] |
round edges | id(the text in the box) |
subroutine shape | id[[the text in the box]] |
database | id[(Database)] |
circle | id((the text in the box)) |
asymmetric shape | id>the text in the box] |
rhombus | id{the text in the box} |
hexagon | id{{the text in the box}} |
parallelogram | id[/the text in the box/] |
parallelogram alt | id[\the text in the box\] ※need escape \\
|
trapezoid | id[/the text in the box\] ※need escape \\
|
trapezoid alt | id[\the text in the box/] ※need escape \\
|
double circle | id(((the text in the box))) |
arrow type
Type | right | left | both |
---|---|---|---|
oo | --o | o-- | o--o |
<> | --> | <-- | <--> |
xx | --x | x-- | x--x |
line / arrow length
Length | 1 | 2 | 3 |
---|---|---|---|
Normal | --- | ---- | ----- |
Normal with arrow | --> | ---> | ----> |
Thick | === | ==== | ===== |
Thick with arrow | ==> | ===> | ====> |
Dotted | -.- | -..- | -...- |
Dotted with arrow | -.-> | -..-> | -...-> |
subgraph
subgraph sub
C --> D
end
A --> sub --> B
SequenceDiagram
participant / actor / and alias
actor A as Alice
actor Bob
participant UA as User Agent
line / arrow type
Type | Description |
---|---|
-> | Solid line without arrow |
--> | Dotted line without arrow |
->> | Solid line with an arrowhead |
-->> | Dotted line with an arrowhead |
-x | Solid line with a cross at the end |
--x | Dotted line with a cross at the end |
-) | Solid line with an open arrow at the end (async) |
--) | Dotted line with an open arrow at the end (async) |
message
<br />
で改行可能
activations
activate and deactivate
A ->> B : hello
activate B
B -->> A : hi
deactivate B
others
A ->>+ B : hello
B -->>- A : hi
note / note over
note right of Bob : Text in note
note over Alice, Bob : Text in note over line
loop / alt / parallel / critical region / break
長くなるので省略
background highlighting
rect rgba(0, 0, 255, .1)
... content ...
end
色指定は 色名(red など)でも rgb でも rgba でも可能。
このスクラップは2023/11/07にクローズされました