draw.io — редактор диаграмм¶

Draw.io (с 2021 года — diagrams.net) — бесплатный веб-сервис и десктопное приложение для построения диаграмм, схем, блок-схем, UML-диаграмм, сетевых топологий и других графических схем. Сервис работает в браузере без регистрации, поддерживает сохранение файлов в собственном формате .drawio (XML), а также экспорт в PNG, SVG, PDF и Visio (.vsdx). Проект распространяется по лицензии Apache 2.0, исходный код открыт.

¶История и разработчик

Draw.io был создан в 2010 году немецким предпринимателем Генрихом Рашем (Henrich Rauch) и Йенсом Ленцем (Jens Lenz) в рамках стартапа JGraph. Компания JGraph ранее разработала библиотеку mxGraph для построения диаграмм в JavaScript, на которой впоследствии построен сам Draw.io. В 2017 году JGraph была приобретена компанией Gliffy, а в 2020 году Gliffy вошла в состав Atlassian. Несмотря на смену владельцев, сервис продолжил работать как самостоятельный продукт.

В 2021 году сервис был переименован в diagrams.net, хотя старое название draw.io по-прежнему широко используется. Домен draw.io автоматически перенаправляет на app.diagrams.net.

¶Возможности

Draw.io позволяет создавать широкий спектр диаграмм:

• Блок-схемы — стандартные элементы по нотациям Flowchart и BPMN;
• UML-диаграммы — классов, последовательностей, вариантов использования, состояний, компонентов;
• Сетевые схемы — с библиотеками устройств Cisco, AWS, Azure, GCP, Kubernetes;
• Организационные структуры, ментальные карты, временные шкалы;
• Схемы баз данных (ER-диаграммы), диаграммы Венна, инфографика.

Ключевые технические характеристики:

¶Редактор и интерфейс

Интерфейс Draw.io построен по классической схеме: слева — библиотеки фигур и шаблонов, в центре — рабочее поле, справа — панель свойств выбранного объекта. Поддерживается работа с группами объектов, слоями, привязкой к сетке, автосохранение, отмена действий (Ctrl+Z), горячие клавиши. Экспорт в SVG позволяет получать векторные изображения, пригодные для вставки в документы и веб-страницы.

Для совместной работы Draw.io предлагает режим совместного редактирования через ссылку (share link), при этом изменения отображаются у всех участников в реальном времени.

¶Хранение файлов

По умолчанию диаграммы сохраняются в облачное хранилище пользователя (Google Drive, OneDrive, GitHub и т. д.) или на локальный компьютер. Альтернативно можно использовать встроенное хранилище diagrams.net, привязанное к аккаунту Google или Microsoft. Файлы .drawio — обычные XML-документы, что позволяет хранить их в системах контроля версий и редактировать вручную.

¶Десктопные версии

Помимо веб-версии, существуют настольные приложения для Windows, macOS и Linux, построенные на Electron. Они доступны для скачивания на официальном сайте и в магазинах приложений. Также доступны расширения для браузеров Chrome и Firefox, позволяющие открывать диаграммы без перехода на отдельный сайт.

¶Применение

Draw.io широко используется в разработке ПО для документирования архитектуры, в системном администрировании для схем сетей, в бизнес-анализе для моделирования процессов, в образовании для создания учебных материалов. Свободная лицензия и отсутствие регистрации для базового использования делают его популярной альтернативу коммерческим продуктам — Microsoft Visio, Lucidchart, Gliffy.

¶Сравнение с альтернативами

¶Интересные факты

• Draw.io входит в состав GitLab как встроенный редактор диаграмм (функция GitLab Architecture Diagrams).
• В Visual Studio Code существует расширение, позволяющее редактировать файлы .drawio прямо в редакторе кода.
• Проект mxGraph, на котором построен Draw.io, в 2020 году был переименован в maxGraph и передан сообществу.

Источники:

• Официальный сайт diagrams.net
• Документация проекта mxGraph / maxGraph
• Лицензия Apache 2.0, текст лицензии
• Статья о JGraph в реестре компаний Великобритании