Программы для Диаграммы

Информация о материале: Категория: Разное; Обновлено: 14 апреля 2026; Просмотров: 96

devops
other

1. Plantuml
2. Dia
3. Draw.io
4. Miro
5. mermaid.ai

Диаграммы как рабочие инструмент, а не только для документирования и презентаций. Для индивидуального использования я выбрал PlantUML, а для работы в команде Miro.
PlantUML - мой выбор, потому что диаграмму можно писать текстом, а PlantUML ее сам визуализирует и размещает на странице, бесплатный и работает везде, что-то типа блокнота.

Miro - отличный сервис, мегамонстр, но платный (есть бесплатный вариант с некоторыми ограничениями). И в одном из проектов очень даже показал себя.
Drawio и Dia - бесплатный сервис, удобен когда нужно еще и распечатать или вывести на печать, сохранить в pdf.

1. Plantuml

Online и offline.
Разработано на Java.
Есть плагин для VSCode</br/> Online сервис:
https://plantuml.com/ru/
Диаграммы без боли и страданий: PlantUML (habr.com)
Запуск в командной строке:

java -jar ~/po/plantuml/plantuml-gplv2-1.2026.2.jar

(Java 11) Фишка программы в том, что описание диаграммы можно писать прямо в текстовом файле, а программа сама ее рисует.
Есть плагин для VSCode:

vscode_plantuml

Еще примеры:

Пример 1

create_order.puml:

@startuml

participant Client
participant API
participant Database

Client -> API: POST /orders
API -> Database: Insert new Order
Database --> API: Order ID (ID: 456)
API --> Client: Order Created (ID: 456)

Client -> API: GET /orders/456
API -> Database: Fetch Order Details
Database --> API: Order Data
API --> Client: Order Details

Client -> API: PATCH /orders/456/cancel
API -> Database: Update Order Status (cancelled)
Database --> API: Succes
API --> Client: Order Cancelled

Client -> API: PATCH /orders/456/complete
API -> Database: Update Order Status (completed)
Database --> API: Success
API --> Client: Order Completed

@enduml

Пример 2

demo_plant.puml:

@startuml
Allice -> Bob3 : dot_3

Allice - Dom1: AAA

Bob3 - Allice: Hello

Allice -> Bob : hello

Allice ..> Bob1 : hello dot
Allice ..> Bob2 : hello dot 2

@enduml

Пример 3

plant_uml2.puml:

@startuml

package "Клиентская часть" {
  [Мобильное приложение]
  [Веб-приложение]
}

package "Серверная часть API" {
  [API Gateway]
  [Сервис управления заказами]
  [Сервис очередей задач]
}

package "Внешние системы" {
  [Платежный сервис]
  [Сервис доставки]
  [Сервис уведомлений]
}

[Мобильное приложение] --> [API Gateway]
[Веб-приложение] --> [API Gateway]
[API Gateway] --> [Сервис управления заказами]
[Сервис управления заказами] --> [Сервис очередей задач]
[Сервис управления заказами] --> [Платежный сервис]
[Сервис управления заказами] --> [Сервис доставки]
[Сервис очередей задач] --> [Сервис уведомлений]

@enduml

2. Dia

Dia
Работает в offline.
Пример диаграмм:

dia

3. Draw.io

Сервис Draw.io

drawio_example1

4. Miro

Online web сервис. Монстр!
https://miro.com/
Пример диаграммы:

miro

5. Mermaid.ai

https://mermaid.ai/open-source/
Так же как и PlantUML описание диаграммы пишется в текстовом файле. Пример диаграммы:

flowchart TD
A[Christmas] -->|Get money| B(Go shopping)
B --> C{Let me think}
C -->|One| D[Laptop]
C -->|Two| E[iPhone]
C -->|Three| F[fa:fa-car Car]

mermaid

Вы здесь: