Чем темнее клетка, тем выше балл по этому показателю.
МеньшеБольше
Последняя проверка Источники и титрыМедиа-кредитыМетодология
Короткие ответы
Когда выбирать «Текстовые диаграммы русалок»?
Когда история такая: документация процесса, адаптация, логика назначения, пояснения по связям с общественностью.
Когда избегать?
В случаях вроде: идеальные по пикселям иллюстрации бренда, требующие макета от руки.
Кто изобрёл или распространил?
Mermaid (2014) популяризировала диаграммы на основе Markdown на GitHub.
Что кодирует?
синтаксис текстового графа, отображаемый в полях и краях SVG
Можно в рекламе?
Да, если тезис виден сразу в Meta, Google и печать; иначе ссылка на полный рисунок.
Примет учитель?
Да для лабораторные и стенды, если есть оси, единицы и строка источника.
Текстовые диаграммы русалок кодирует значения как синтаксис текстового графа, отображаемый в полях и краях SVG. Mermaid (2014) популяризировала диаграммы на основе Markdown на GitHub..
В отчётах, рекламе и заданиях: документация процесса, адаптация, логика назначения, пояснения по связям с общественностью. Избегайте, если идеальные по пикселям иллюстрации бренда, требующие макета от руки.
ПО
- Mermaid — Поток, последовательность, класс, ER и многое другое из текста — лицензия MIT. · MIT · github.com/mermaid-js/mermaid
- Mermaid CLI — Рендеринг диаграмм в SVG/PNG в CI без SaaS. · MIT · github.com/mermaid-js/mermaid-cli
- markdown-it — Часто используется для встраивания границ диаграмм в документы. · MIT · github.com/markdown-it/markdown-it
- GitHub markup notes — Изучите, как кузницы визуализируют Русалку, в файлах README. · MIT · github.com/github/markup
- Flow demo SVG — Статические блок-схемы учебных оценок в этом атласе. · CC0 examples · github.com/Tool-Lifes/viz-atlas
Экспорт
- Экспорт 1 — SVG
- Экспорт 2 — PDF
- Экспорт 3 — EMF/SVG в слайды (без скриншотов)
- Экспорт 4 — SVG для веба, PDF для печати
Доступность
- Доступность 1 — Никогда не цвет один. Сложите узор, подпись и положение.
- Доступность 2 — 4,5:1 для текста, 3:1 для крупных марок.
- Доступность 3 — Короткий alt у графика; числа также HTML-таблицей.
- Доступность 4 — Движение только как акцент. Уважайте prefers-reduced-motion.
«Текстовые диаграммы русалок»: чтите синтаксис текстового графа, отображаемый в полях и краях SVG и меняйте, если идеальные по пикселям иллюстрации бренда, требующие макета от руки.