【Markdown】【mermaid】Mermaid时序图基础语法Sequence Diagrams - Basic Syntax

2024-03-22 01:04

本文主要是介绍【Markdown】【mermaid】Mermaid时序图基础语法Sequence Diagrams - Basic Syntax,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

时序图 - Sequence Diagrams

简介 - Introduction

时序图是一种交互图,显示了流程如何相互操作以及它们的执行顺序。它可以用来描述用例场景或设计一个良好的面向对象系统。

Sequence diagrams are a type of interaction diagram that illustrate how flows operate with one another and in what order. They can be used to describe use case scenarios or to design a good object-oriented system.

Mermaid可以渲染时序图。时序图的代码如下所示:

Mermaid can render sequence diagrams. The code for a sequence diagram looks like this:

Alice John Hello John, how are you? Great! See you later! Alice John

语法 - Syntax

参与者 - Participants

参与者可以隐式地定义,就像上面的示例一样。mermaid也支持通过 participant 关键字显式地定义参与者。

The participants can be defined implicitly as in the first example on this page. The participants or actors are rendered in order of appearance in the diagram source text. Sometimes you might want to show the participants in a different order than how they appear in the first message. It is possible to specify the actor’s order of appearance by doing the following:

John Alice Hello John, how are you? Great! John Alice

别名 - Aliases

可以为参与者定义一个快捷方式,如下所示:

Actors can be defined with an alias, using the as keyword:

Alice John Hello John, how are you? Great! Alice John

动作 - Actions

可以使用符号 ->-->->>-->> 来表示实线或虚线的箭头。可以添加文本用于描述箭头表示的交互。比如 -> 箭头后面可以添加 : text

There is a slight difference between:

  • -> used for solid arrow
  • --> used for dotted arrow
  • ->> used for solid arrow with async semantic and should be used to represent calls that are not waited for to return. Typically used in a request-response pattern to represent the request.
  • -->> used for dotted arrow with async semantic. Generally used to model a response being returned from a request-response pattern.

You can add a text to your arrow using :<text> after the arrow characters or before for the returned response.

Alice John Hello John, how are you? Great! Alice John

激活状态 - Activations

可以使用 activatedeactivate 关键字来表示参与者的激活状态。

It is possible to activate and deactivate participants, by using activate and deactivate

Alice John Hello John, how are you? Great! Alice John

省略 activatedeactivate 关键字时会自动激活。

Activations can be stacked for same actor:

Alice John Hello John, how are you? John, can you hear me? Hi Alice, I can hear you! I feel great! Alice John

备注 - Notes

可以通过 Note [ right of | left of | over ] [Actor]: Text 的语法添加备注。

It is possible to add notes to a sequence diagram. This is done by the notation Note [ right of | left of | over ] [Actor]: Text where text is the text inside the note.

可以在某个参与者的右侧或左侧放置备注:

See the example below:

John Text in note John

可以在多个参与者上方放置备注:

It is also possible to create notes spanning two participants:

Alice John Hello John, how are you? A typical interaction Alice John

循环 - Loops

可以使用 loop 关键字表示循环。循环中的内容要缩进。

It is possible to express loops in a sequence diagram. This is done by the notation loop Loop text. To add content to loop, indent it.

See the example below:

Alice John Hello John, how are you? Great! loop [Every minute] Alice John

选择 - Alt

可以使用 alt 关键字表示选择。选择中的内容要缩进。

It is possible to express alternative paths in a sequence diagram. This is done by the notation alt Description. To add content to alt, indent it.

See the example below:

Alice Bob Hello Bob, how are you? Not so good :( Feeling fresh like a daisy alt [is sick] [is well] Thanks for asking opt [Extra response] Alice Bob

并行 - Parallel

可以使用 par 关键字表示并行。并行中的内容要缩进。

It is possible to show actions that are happening in parallel. This is done by the notation par [Action 1] and [Action 2]. To add content to a parallel block, indent it.

See the example below:

Alice Bob John Hello guys! Hello guys! par [Alice to Bob] [Alice to John] Hi Alice! Hi Alice! Alice Bob John

背景高亮 - Background Highlighting

可以使用 rect 关键字高亮某一部分图表的背景。

It is possible to highlight flows by providing colored background rects. This is done by the notation rect rgb(0, 255, 0). To add content to a rect block, indent it.

See the examples below:

Alice John Alice calls John. Hello John, how are you? John, can you hear me? Hi Alice, I can hear you! I feel great! Did you want to go to the game tonight? Yeah! See you there. Alice John

注释 - Comments

可以在时序图代码中使用 %% 添加注释。注释将不会在图像中渲染。

Comments can be entered within a sequence diagram, which will be ignored by the parser. Comments need to be on their own line, and must be prefaced with %% (double percent signs). Any text after the start of the comment to the next newline will be treated as a comment, including any diagram syntax.

Alice John Hello John, how are you? Great! Alice John

实体类 - Entity codes to escape characters

可以使用 HTML 字符名称来转义字符。

It is possible to escape characters using the syntax exemplified here.

A B I ♥ you! I ♥ you ∞ times more! A B

Numbers given are base 10, so # can be encoded as #35;. It is also supported to use HTML character names.

Styling

可以对图表的各个部分应用样式:

It is possible to style the sequence diagram in a limited way. Currently the three configurations below are supported:

%%{init: { 'theme': 'base' }}%%
%%{init: { "theme": "dark", 'themeVariables': { 'primaryColor': '#ff0000'}}}%%
%%{init: { 'theme': 'base', 'themeVariables': { 'primaryTextColor': '#00ff00', 'actorLineColor': '#ff0000'}}}%%

你需要将这个配置加在你的图表定义 前面 以使 theme 生效,如下所示:

You need to add this configuration before your diagram definition, as shown below:

Alice Bob Hello Bob, how are you? Not so good :( Feeling fresh like a daisy alt [is sick] [is well] Thanks for asking opt [Extra response] Alice Bob

片段化循环 - Fragmented Loops

要创建一个片段化循环,需要像通常一样定义循环,并将不重复的片段放在一个可选部分中。

To create a fragmented loop, define your loop as you normally would, placing the fragments that don’t repeat inside of an optional section.

sequenceDiagramConsumer-->>API: Book somethingloop 3 timesAPI-->>BookingService: Start booking processbreak when the booking process failsAPI-->>Consumer: show failureendalt Hotel 1 not availableAPI-->>BookingService: Try another hotelendopt If hotel 2 is availableAPI-->>Consumer: Send confirmationendAPI-->>Consumer: Send final confirmationend

片段化替代路径 - Fragmented Alt

片段化替代路径与常规替代路径类似,但可以中断和继续替代路径。

Fragmented alt is similar to regular alt. The difference being that it allows for a breaking out and a continuation of the alt scenario.

sequenceDiagramConsumer-->>API: Start booking processAPI-->>BookingService: Start booking processalt Booking succeedsBookingService-->>API: Booking succeedsAPI-->>Consumer: Booking succeedselse Booking failsBookingService-->>API: Booking failedbreak Valid alternative accomodations existAPI-->>Consumer: Suggest alternative accomodationsalt Consumer accepts one of the alternativesConsumer-->>API: Consumer accepts alternativeAPI-->>BookingService: Start booking process with alternativeBookingService-->>API: Booking succeedsAPI-->>Consumer: Booking succeedselse Consumer does not accept alternativesConsumer-->>API: Consumer rejects alternativeAPI-->>Consumer: Booking failsendendend

注意片段化替代路径中的 break 语句。当没有片段化替代路径可用时,break 指令允许您指定当前替代路径应如何中断。

Note the “break” inside the fragmented alt. The “break” allows the developer to specify under what circumstances that current alt fragment should break.

严格模式 - Strict mode

可以通过在图表定义上方添加指令来启用严格模式:

You can enable strict mode on your diagram by adding %%{init: { 'theme': 'base', 'sequence': { 'showSequenceNumbers': true } }%% before your diagram definition like so:

Alice Bob Hello Bob, how are you? Not so good :( Feeling fresh like a daisy alt [is sick] [is well] Thanks for asking opt [Extra response] Alice Bob

严格模式下不允许使用旧的语法(如 -->),并且必须使用新的语法(如 ->>-->> 表示异步)。此外,还必须使用 activatedeactivate 关键字来表示激活状态。

In strict mode, only the new notation is allowed (e.g. --> is forbidden, must use -->>, for async) and sequence numbers are added to the diagram. Strict mode also enables showSequenceNumbers, this shows sequence numbers on the diagram.

箭头类型 - Arrow types

There are six types of arrows currently supported:

TypeDescription
->Solid line without arrow
–>Dotted line without arrow
->>Solid line with arrowhead
–>>Dotted line with arrowhead
-xSolid line with a cross at the end
–xDotted line with a cross at the end

这篇关于【Markdown】【mermaid】Mermaid时序图基础语法Sequence Diagrams - Basic Syntax的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/834226

相关文章

从基础到进阶详解Pandas时间数据处理指南

《从基础到进阶详解Pandas时间数据处理指南》Pandas构建了完整的时间数据处理生态,核心由四个基础类构成,Timestamp,DatetimeIndex,Period和Timedelta,下面我... 目录1. 时间数据类型与基础操作1.1 核心时间对象体系1.2 时间数据生成技巧2. 时间索引与数据

C#实现将Office文档(Word/Excel/PDF/PPT)转为Markdown格式

《C#实现将Office文档(Word/Excel/PDF/PPT)转为Markdown格式》Markdown凭借简洁的语法、优良的可读性,以及对版本控制系统的高度兼容性,逐渐成为最受欢迎的文档格式... 目录为什么要将文档转换为 Markdown 格式使用工具将 Word 文档转换为 Markdown(.

安装centos8设置基础软件仓库时出错的解决方案

《安装centos8设置基础软件仓库时出错的解决方案》:本文主要介绍安装centos8设置基础软件仓库时出错的解决方案,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐... 目录安装Centos8设置基础软件仓库时出错版本 8版本 8.2.200android4版本 javas

Linux基础命令@grep、wc、管道符的使用详解

《Linux基础命令@grep、wc、管道符的使用详解》:本文主要介绍Linux基础命令@grep、wc、管道符的使用,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐... 目录grep概念语法作用演示一演示二演示三,带选项 -nwc概念语法作用wc,不带选项-c,统计字节数-

使用Python实现网页表格转换为markdown

《使用Python实现网页表格转换为markdown》在日常工作中,我们经常需要从网页上复制表格数据,并将其转换成Markdown格式,本文将使用Python编写一个网页表格转Markdown工具,需... 在日常工作中,我们经常需要从网页上复制表格数据,并将其转换成Markdown格式,以便在文档、邮件或

python操作redis基础

《python操作redis基础》Redis(RemoteDictionaryServer)是一个开源的、基于内存的键值对(Key-Value)存储系统,它通常用作数据库、缓存和消息代理,这篇文章... 目录1. Redis 简介2. 前提条件3. 安装 python Redis 客户端库4. 连接到 Re

SpringBoot基础框架详解

《SpringBoot基础框架详解》SpringBoot开发目的是为了简化Spring应用的创建、运行、调试和部署等,使用SpringBoot可以不用或者只需要很少的Spring配置就可以让企业项目快... 目录SpringBoot基础 – 框架介绍1.SpringBoot介绍1.1 概述1.2 核心功能2

Spring Boot集成SLF4j从基础到高级实践(最新推荐)

《SpringBoot集成SLF4j从基础到高级实践(最新推荐)》SLF4j(SimpleLoggingFacadeforJava)是一个日志门面(Facade),不是具体的日志实现,这篇文章主要介... 目录一、日志框架概述与SLF4j简介1.1 为什么需要日志框架1.2 主流日志框架对比1.3 SLF4

Spring Boot集成Logback终极指南之从基础到高级配置实战指南

《SpringBoot集成Logback终极指南之从基础到高级配置实战指南》Logback是一个可靠、通用且快速的Java日志框架,作为Log4j的继承者,由Log4j创始人设计,:本文主要介绍... 目录一、Logback简介与Spring Boot集成基础1.1 Logback是什么?1.2 Sprin

PostgreSQL 序列(Sequence) 与 Oracle 序列对比差异分析

《PostgreSQL序列(Sequence)与Oracle序列对比差异分析》PostgreSQL和Oracle都提供了序列(Sequence)功能,但在实现细节和使用方式上存在一些重要差异,... 目录PostgreSQL 序列(Sequence) 与 oracle 序列对比一 基本语法对比1.1 创建序