Диаграммы

Примечание

На этой странице описана работа в новом редакторе Wiki. О разметке в старом редакторе читайте в разделе Справочник разметки (старый редактор).

Чтобы добавить на страницу диаграмму, схему или граф, можно использовать один из поддерживаемых языков текстовой разметки:

Mermaid

Вы можете разместить в тексте диаграмму, созданную с помощью Mermaid.

Визуальный редактор

Разметка Markdown

На панели инструментов нажмите Mermaid.

Вы также можете использовать меню быстрого доступа: введите символ / и выберите команду из списка.
В поле справа опишите диаграмму, используя язык разметки Mermaid.
Нажмите Сохранить.
Чтобы отредактировать уже созданную диаграмму, в ее правом верхнем углу нажмите → Edit.

Чтобы разместить на странице диаграмму Mermaid, добавьте код в формате:


 ```mermaid
 sequenceDiagram
    Alice->>Bob: Hi Bob
    Bob->>Alice: Hi Alice
 ```

Draw.io — сервис для создания диаграмм онлайн.

Визуальный редактор

Разметка Markdown

На панели инструментов нажмите Draw.io.

Вы также можете использовать меню быстрого доступа: введите символ / и выберите команду из списка.
Нарисуйте диаграмму: в Draw.io вы можете добавлять, удалять и изменять элементы, а также рисовать от руки.
- Чтобы добавить элемент, выберите его на панели слева. Он появится в центре холста, после чего вы сможете его перемещать и редактировать.
- Вы также можете перейти в режим рисования. Для этого нажмите на панели слева кнопку . Чтобы рисовать на холсте от руки, зажмите левую кнопку мыши.
Нажмите Сохранить.
Чтобы изменить размеры диаграммы, в ее правом верхнем углу нажмите → Настройки и укажите ширину и высоту в пикселях.
Чтобы отредактировать уже созданную диаграмму, в ее правом верхнем углу нажмите → Редактировать.

Функция не поддерживается в режиме разметки Markdown.

Вы можете разместить на странице диаграммы, которые поддерживает библиотека PlantUML.

Подробнее о языке разметки диаграмм PlantUML можно прочитать в Справочном руководстве по языку PlantUML.

Визуальный редактор

Разметка Markdown

На панели инструментов нажмите PlantUML.

Вы также можете использовать меню быстрого доступа: введите символ / и выберите команду из списка.
В поле справа опишите диаграмму, используя язык разметки библиотеки PlantUML.
Нажмите Сохранить.
Чтобы отредактировать уже созданную диаграмму, в ее правом верхнем углу нажмите → Редактировать.

Чтобы разместить на странице диаграмму PlantUML, добавьте код в формате:

{% diagram %}

@startuml
Bob->Alice:Hello
@enduml

{% enddiagram %}