Просмотр Markdown на Mac,который рисует диаграммы Mermaid.
Напишите диаграмму текстом в блоке кода с пометкой mermaid, и DotMD нарисует её на странице. Ничего не уходит с вашего Mac: всё работает офлайн, в светлой и тёмной теме.
macOS 14 или новее. Чтение бесплатно; редактирование и ревью оплачиваются один раз.
Коротко
DotMD — программа для просмотра Markdown на Mac с поддержкой Mermaid. Блок кода с пометкой mermaid рисуется как блок-схема, диаграмма последовательности, классов, состояний или «сущность — связь», диаграмма Ганта, круговая диаграмма, интеллект-карта, временная шкала или граф git, офлайн и в цветах вашей темы. Просмотр бесплатный; писать с живым предпросмотром можно в DotMD Editor.
Какие диаграммы Mermaid рисует DotMD?
В DotMD встроен Mermaid 10.9. Он рисует диаграммы этих видов, а в редакторе для каждого есть готовый шаблон:
- Блок-схемы и диаграммы состояний: шаги, решения и переходы.
- Диаграммы последовательности: кто что кому отправляет, по порядку.
- Диаграммы классов и диаграммы «сущность — связь»: типы, таблицы и связи между ними.
- Диаграммы Ганта и временные шкалы: планы и события во времени.
- Круговые диаграммы, интеллект-карты и графы git.
Диаграмма остаётся текстом в вашем .md-файле, поэтому её легко менять, а каждая правка видна в истории версий.
Как посмотреть Mermaid в Markdown-файле на Mac
Блок кода с пометкой mermaid становится на странице диаграммой вместо исходного текста.
-
Откройте файл
Нажмите ⌘O и выберите .md-файл или его папку либо перетащите файл на DotMD. Каждая диаграмма рисуется при открытии страницы.
-
Рассмотрите поближе
Нажмите на диаграмму, чтобы увидеть её крупно поверх страницы. Жестом сведения пальцев увеличьте её до 8×, перетаскиванием сдвиньте, а клавишей Esc вернитесь.
-
В тон теме
Диаграммы следуют за страницей: они рисуются светлыми или тёмными цветами в зависимости от темы, которую вы выбрали в меню Aa.
Пишите Mermaid с живым предпросмотром
Редактирование входит в DotMD Editor. Нажмите Edit или ⌘E и включите Preview (⌥⌘E): диаграмма перерисовывается рядом с текстом по мере набора, а щелчок по ней переходит к её коду.
Insert → Diagram вставляет в файл рабочий пример любого из десяти видов, готовый к правке.
Mermaid в Quick Look, PDF и HTML
Нажмите пробел на .md-файле в Finder, и в просмотре тоже появятся диаграммы: просмотр Markdown через Quick Look.
Export as PDF… рисует диаграммы до создания PDF: Markdown в PDF на Mac. Экспортированный HTML-файл при открытии загружает Mermaid из интернета.
Если диаграмма не появляется
- Проверьте первую строку: в ней назван вид диаграммы, например
flowchart TDилиsequenceDiagram. - Подпись со скобками, двоеточиями или кавычками возьмите в двойные кавычки:
"…". - Ошибка в синтаксисе показывает сообщение об ошибке Mermaid вместо рисунка.
Вопросы о Mermaid на Mac
Показывает ли DotMD диаграммы Mermaid офлайн?
Да. Mermaid встроен в DotMD и рисует на вашем Mac, без подключения к интернету. Только экспортированный HTML-файл загружает его из интернета.
Бесплатно ли смотреть диаграммы Mermaid?
Да. Чтение Markdown с диаграммами, папки, вкладки и Quick Look бесплатны навсегда. Редактирование с живым предпросмотром входит в DotMD Editor, $14.99 один раз.
Какие диаграммы Mermaid можно использовать?
Блок-схемы, диаграммы последовательности, классов, состояний и «сущность — связь», диаграммы Ганта, круговые диаграммы, интеллект-карты, временные шкалы и графы git. В редакторе для каждого есть шаблон.
Как править Mermaid с живым предпросмотром?
В DotMD Editor нажмите ⌘E, затем ⌥⌘E. Диаграмма перерисовывается рядом с текстом по мере набора.