Graphviz DOT онлайн

Graphviz DOT как редакти­руемая диаграмма.

Вставьте граф DOT, и LetDraw превратит его в настоящие фигуры и стрелки, которые можно двигать, менять стиль и которыми можно делиться. Это Graphviz DOT онлайн без статичной картинки в конце: кластеры становятся фреймами, а подписи рёбер сохраняются. Всё работает в браузере, с экспортом в PNG, SVG или PDF.

deps.dot · editable graph
backend calls reads sends loads web api database queue cdn
Шаг за шагом

Как открыть Graphviz DOT онлайн в LetDraw

От файла .dot до редактируемого графа, которым можно поделиться, за минуту, прямо в браузере.

  1. Откройте «Создать из кода»

    В LetDraw откройте «Создать из кода» (функция Pro) из меню «Другие инструменты» или палитры команд.

  2. Вставьте DOT

    Вставьте graph или digraph либо загрузите файл .dot или .gv. Формат определяется автоматически, и сразу появляется предпросмотр.

  3. Выберите раскладку

    Выберите направление сверху вниз или слева направо, аккуратный или эскизный стиль и скройте ненужные типы подписей рёбер.

  4. Вставьте и поделитесь

    Поместите граф на холст, редактируйте его как любой рисунок, отправьте ссылку или экспортируйте в PNG, SVG или PDF.

Из DOT в диаграмму

Просмотрщик DOT, который даёт редактируемый граф

LetDraw сам читает язык DOT и раскладывает граф собственным кластерным алгоритмом, поэтому результат состоит из настоящих фигур, а не из отрендеренной картинки. Понимаются операторы узлов и рёбер, цепочки вроде a -> b -> c, атрибуты label и блоки subgraph cluster_.

  • Кластеры становятся фреймами с именем из подписи кластера
  • Умные соединители, которые обходят фигуры, а не пересекают их
  • Экспорт в Mermaid или D2, когда граф снова нужен в виде кода
Попробовать
digraph G { subgraph cluster_b { label="backend"; api -> db; } web -> api [label="calls"]; } calls web backend api db
Что рисуют

Что делать с Graphviz DOT онлайн

Многие инструменты и скрипты выводят DOT. LetDraw превращает этот вывод в диаграмму, с которой люди могут работать.

Графы зависимостей

Вставьте DOT, который выводит инструмент сборки или пакетный менеджер, и приведите результат к виду, который можно показать.

Конечные автоматы

Превратите состояния и переходы, записанные на DOT, в диаграмму, которую вся команда может читать и комментировать.

Сгенерированные графы

Пусть скрипт выводит DOT для графов вызовов, пайплайнов или происхождения данных, а затем доработайте диаграмму вручную.

Новая жизнь старых документов

Перенесите файлы .dot из старой вики на холст, где любой может редактировать их без набора инструментов.

Совместное ревью

Поделитесь доской, прикрепляйте комментарии к любому узлу и редактируйте граф вместе с другими в реальном времени.

Графы для обучения

Напишите небольшой граф на DOT, откройте его на холсте и рисуйте поверх, пока объясняете.

Вопросы

Graphviz DOT онлайн: частые вопросы

Открывать файлы DOT в LetDraw бесплатно?
«Создать из кода», которое превращает граф DOT в диаграмму, входит в Pro. Рисование вручную, шаблоны, библиотеки фигур и экспорт в PNG, SVG и PDF бесплатны на тарифе Free, без банковской карты.
LetDraw запускает Graphviz?
Нет. LetDraw читает текст DOT в вашем браузере и использует собственную раскладку, поэтому положение узлов может отличаться от рендера Graphviz. Зато каждый узел и каждая стрелка остаются редактируемыми фигурами.
Какие части DOT поддерживаются?
graph и digraph, операторы узлов и рёбер, цепочки рёбер, атрибуты label и кластеры subgraph с подписями. HTML-подписи, порты record и настройки rank игнорируются, а ненаправленные рёбра рисуются стрелками.
Можно ли снова экспортировать граф?
Да. Экспортируйте его в PNG, SVG или PDF, поделитесь ссылкой или режимом только для чтения либо экспортируйте как код Mermaid или D2.

Ваш граф DOT, готовый к редактированию.

Откройте LetDraw в браузере, вставьте DOT и получите фигуры, которые можно двигать. Быстро и без установки.