Mermaid: различия между версиями

Материал из Поле цифровой дидактики
Строка 1: Строка 1:
== Какие бывают UML диаграммы ==


=== Диаграмма классов - classDiagram ===
=== Диаграммы классов ===
* https://mermaid-js.github.io/mermaid/#/classDiagram
* [[[Mermaid/ClassDiagram]]


{{#mermaid:classDiagram
{{#ask: [[[Mermaid/ClassDiagram]] |format=embedded }}
  direction LR
classA --|> classB : Inheritance
classC --* classD : Composition
classE --o classF : Aggregation
classG --> classH : Association
classI -- classJ : Link(Solid)
classK ..> classL : Dependency
classM ..|> classN : Realization
classO .. classP : Link(Dashed)


}}
=== Диаграммы последовательностей ===


=== Диаграмма последовательности ===
* [[Mermaid/SequenceDiagram]]
{{#mermaid:sequenceDiagram
    participant dotcom
    participant iframe
    participant viewscreen
    dotcom->>iframe: loads html w/ iframe url
    iframe->>viewscreen: request template
    viewscreen->>iframe: html & javascript
    iframe->>dotcom: iframe ready
    dotcom->>iframe: set mermaid data on iframe
    iframe->>iframe: render mermaid
}}


=== Диаграмма последовательности ===
{{#ask: [[[Mermaid/SequenceDiagram]] |format=embedded }}
{{#mermaid:sequenceDiagram
participant Alice
participant Bob
  Alice->John: Hello John, how are you?
  loop Healthcheck
      John->John: Fight against hypochondria
  end
  Note right of John: Rational thoughts <br/>prevail...
    John-->Alice: Great!
    John->Bob: How about you?
    Bob-->John: Jolly good!
}}
 
----
 
{{#mermaid:sequenceDiagram
actor A
A-->B: Привет
}}

Версия 13:01, 20 июля 2022

Какие бывают UML диаграммы

Диаграммы классов

  • [[[Mermaid/ClassDiagram]]

Mermaid/ClassDiagram

Диаграмма классов - classDiagram

Связи классов между собой
значения стрелочек:

Категории и свойства

Страница Вики

State


Диаграммы последовательностей

Mermaid/SequenceDiagram

Диаграмма последовательности


Диаграмма последовательности


Источник — http://digida.mgpu.ru/index.php?title=Mermaid&oldid=1593