最美情侣中文字幕电影,在线麻豆精品传媒,在线网站高清黄,久久黄色视频

歡迎光臨散文網(wǎng) 會(huì)員登陸 & 注冊(cè)

3. Mermaid 教程 — 序列圖

2022-05-18 09:34 作者:沒(méi)有理想的理想國(guó)  | 我要投稿

事實(shí)上,序列圖這個(gè)翻譯或許不那么準(zhǔn)確,也可以稱為時(shí)序圖、順序圖等等,但這里我們還是稱其為序列圖。

序列圖使用關(guān)鍵字 sequenceDiagram 定義。看下面一個(gè)例子:

效果如下:

sequenceDiagram01

我們把 Boy 這樣的結(jié)構(gòu)同樣地稱為一個(gè)節(jié)點(diǎn)(id)。如果像上面一樣沒(méi)有指定形式的話,那么它默認(rèn)就是矩形的。順便說(shuō)一句,上圖也是這種類型的圖表的基本框架,主要由節(jié)點(diǎn)及自身的連線、箭頭及信息(兩者我們稱為路徑)組成。

3.1 節(jié)點(diǎn)樣式與別名

在開(kāi)始部分,我們可以聲明節(jié)點(diǎn)的樣式,使用 participantsactor 。其中 participants 與默認(rèn)樣式是一致的,而 actor 將會(huì)顯示為一個(gè)小人。

顯示為:

sequenceDiagram02


注意,樣式的聲明順序也會(huì)影響節(jié)點(diǎn)的出現(xiàn)順序。上面一個(gè)例子中 Boy 是先于 Girl 出現(xiàn)的。

可以使用類似 樣式 別名 as 節(jié)點(diǎn) 的格式聲明節(jié)點(diǎn)的別名。例如:

這個(gè)例子和上一個(gè)例子的效果是一致的,但在這里我們使用了 B、G 分別代替了 Boy、Girl

3.2 箭頭與信息

這里的信息指的是,箭頭上面的文本。

mermaid 提供的箭頭類型有以下幾種:

箭頭

而箭頭與附帶的消息的代碼格式如下(不需要帶上[]):

這定義了一個(gè)從 id1 指向 id2 的箭頭和信息( id1id2 可以相同)??聪旅嬉粋€(gè)例子。

效果如下:

sequenceDiagram03

3.3 激活 Activations

Activations 這個(gè)概念說(shuō)實(shí)話我也并不是很清楚它在中文里的意思。先看下面一段代碼:

效果:

sequenceDiagram04

我個(gè)人的理解是,它(Activations)標(biāo)記了一個(gè)焦點(diǎn)位置,或者說(shuō)是“對(duì)話”的重要部分。使用 activate id 標(biāo)記起始位置,使用 deactivate id 標(biāo)記結(jié)束位置。而這里的位置都是從上下文中的 id1 arrow id2 中的 id1id2 選擇的。看下面一個(gè)例子:

※ 起始位置和結(jié)束位置所選節(jié)點(diǎn)應(yīng)該是相同的,畢竟,Activations 不能在兩條線上產(chǎn)生。

上述代碼效果:

sequenceDiagram05

也可以使用簡(jiǎn)便寫(xiě)法,在箭頭后面加上 +/- 定義起始位置和結(jié)束位置。

它的效果同上一個(gè)例子是一致的(別忘了通過(guò)聲明設(shè)置節(jié)點(diǎn)出現(xiàn)順序)。注意,這樣的寫(xiě)法里面,+- 是成對(duì)出現(xiàn)的,且 + 出現(xiàn)位置后面的節(jié)點(diǎn)通常作為起始位置(如上面的 A),而對(duì)應(yīng)的 - 會(huì)自動(dòng)確定結(jié)束位置(根據(jù)起始節(jié)點(diǎn)一致)。

你也可以嵌套使用 Activations。例如:

它的效果是這樣的:

sequenceDiagram06

可以發(fā)現(xiàn), Activations 的嵌套是類似計(jì)算機(jī)編程中的嵌套的(由內(nèi)而外?)。

3.4 標(biāo)注

我們可以在節(jié)點(diǎn)自身的連線或者箭頭上做標(biāo)注,使用關(guān)鍵字 Note 。

上面的代碼首先定義了一個(gè) B 節(jié)點(diǎn),然后在其自身的連線右側(cè)(right)插入了一個(gè)標(biāo)注,內(nèi)容為 Note。

這種定義是在節(jié)點(diǎn)自身連線邊上插入標(biāo)注,形式如 Note 位置描述 節(jié)點(diǎn),位置描述有以下幾種:

位置描述

使用同樣的方法,我們可以使用 Note 位置描述 節(jié)點(diǎn)1,節(jié)點(diǎn)2 的格式在箭頭上標(biāo)注,此時(shí)位置只有 over 可選。

效果如下:

sequenceDiagram07

和 Activations 一樣,Note 也會(huì)找上下文中最近的箭頭進(jìn)行標(biāo)注。

3.5 路徑區(qū)域

所謂的區(qū)域,其實(shí)就是一個(gè)框框:D。先看一個(gè)例子。

顯示如:

sequenceDiagram08

很顯然,loop 定義了一個(gè)區(qū)域,其后緊接著的文本則定義了回路的文本(這不是必須的,也就是說(shuō),你可以直接使用 loop ), end 結(jié)束了定義。結(jié)構(gòu)內(nèi)部包含的“消息”則是區(qū)域?qū)?huì)框住的部分。它的語(yǔ)法格式如下:

除了 loop 外,還可以使用 alt、par 等關(guān)鍵字定義此類區(qū)域(這些都是可以嵌套使用的)。

3.5.1 alt 和 opt

alt 的語(yǔ)法格式形如:

相比 loop,alt 多了一個(gè) else 部分(但它不是必須部分),它會(huì)在區(qū)域中加入一個(gè)內(nèi)部分割線,看下面一個(gè)示例代碼:

它的顯示效果如下:

sequenceDiagram09

opt 也可以用來(lái)定義一個(gè)區(qū)域,字面上它表示一個(gè)可選區(qū)域。而語(yǔ)法上,它和 loop 的使用方法一致。這里從略。

3.5.2 par

使用 par 可以顯示并行發(fā)生的路徑。

它顯示為:

sequenceDiagram10

par 的語(yǔ)法格式為:

事實(shí)上,and 部分也不是必選的。




3. Mermaid 教程 — 序列圖的評(píng)論 (共 條)

分享到微博請(qǐng)遵守國(guó)家法律
涞水县| 息烽县| 承德县| 牙克石市| 渑池县| 光山县| 若羌县| 安化县| 将乐县| 大厂| 水富县| 富源县| 庄河市| 利津县| 安多县| 监利县| 宣威市| 白朗县| 苍梧县| 开平市| 泉州市| 龙海市| 丰县| 吉林市| 安溪县| 班戈县| 汽车| 邻水| 炎陵县| 昭通市| 昌江| 兴国县| 邵东县| 汽车| 诏安县| 运城市| 河间市| 铜鼓县| 阿勒泰市| 贵阳市| 缙云县|