XY-диаграммы
Создавайте столбчатые и линейные графики с настраиваемыми осями. Идеально для визуализации данных и анализа трендов.
Что такое XY-диаграммы?
XY-диаграммы — универсальные инструменты визуализации данных, отображающие точки данных на двумерной системе координат. Поддерживая как столбчатые, так и линейные графики, они являются основой для показа трендов, сравнений и распределений. XY-диаграммы — одни из наиболее часто используемых типов графиков в бизнес-отчётности, научных исследованиях и анализе данных.
Редактирование и предпросмотр
Создайте XY-диаграммы с синтаксисом Mermaid и мгновенно увидите изменения.
Example
XY chart example
A Mermaid XY chart combining bars and a line for monthly diagram exports.
Mermaid code
xychart-beta
title "Monthly Diagram Exports"
x-axis [Jan, Feb, Mar, Apr, May]
y-axis "Exports" 0 --> 100
bar [42, 58, 73, 81, 96]
line [40, 55, 70, 84, 94]Типичные сценарии использования
Анализ трендов
Отслеживайте метрики во времени с линейными графиками. Визуализируйте тренды роста, сезонные паттерны и траектории производительности.
Сравнительные отчёты
Сравнивайте значения по категориям со столбчатыми графиками. Показывайте доход по регионам, баллы по командам или количества по категориям.
Панели производительности
Создавайте визуальные сводки ключевых метрик. Комбинируйте столбцы и линии для показа абсолютных значений и трендов.
Документирование данных
Включайте графики в техническую документацию и отчёты. Храните визуализации данных под контролем версий вместе с текстовым контентом.
Ключевые возможности
Столбчатые графики
Создавайте вертикальные столбчатые графики с пользовательскими значениями данных и метками категорий для категориальных сравнений.
Линейные графики
Отображайте непрерывные данные линейными графиками для показа трендов и изменений во времени или по категориям.
Настраиваемые оси
Определяйте метки осей, диапазоны и категории. Устанавливайте минимальные и максимальные значения для точного представления данных.
Комбинированные графики
Накладывайте столбчатые и линейные графики в одной визуализации для одновременного показа нескольких измерений данных.
Лучшие практики
Выбирайте правильный тип графика
Используйте столбцы для категориальных сравнений и линии для трендов во времени. Комбинируйте, показывая оба аспекта.
Подписывайте оси чётко
Всегда включайте подписи осей с единицами измерения. Читатели должны понимать, что показывает график, без дополнительных пояснений.
Начинайте ось Y с нуля
Для столбчатых графиков начинайте ось Y с нуля, чтобы избежать вводящих в заблуждение визуальных пропорций.
Ограничивайте наборы данных
Показывайте один-два набора данных на график. Слишком много накладывающихся серий делают графики нечитаемыми.
Другие типы диаграмм
Блок-схемы
Визуализируйте процессы, рабочие потоки и алгоритмы с помощью узлов и направленных стрелок. Идеально для бизнес-процессов и деревьев решений.
Диаграммы последовательности
Документируйте взаимодействия между различными участниками или системами во времени. Идеально для документации API и проектирования систем.
Диаграммы классов
Моделируйте объектно-ориентированные системы с классами, атрибутами и связями. Необходимы для планирования архитектуры ПО.
Диаграммы состояний
Отображайте переходы состояний в системах или приложениях. Отлично подходят для моделирования жизненных циклов и рабочих процессов.
Диаграммы Ганта
Планируйте и отслеживайте сроки проектов с задачами и зависимостями. Идеально для управления проектами и составления расписаний.
ER-диаграммы
Проектируйте схемы баз данных с сущностями и связями. Идеально для моделирования и документирования баз данных.
Пользовательский путь
Отображайте пользовательский опыт и взаимодействия в различных точках контакта. Отлично подходит для UX-дизайна и картирования клиентского пути.
Git-графы
Визуализируйте стратегии ветвления и историю коммитов в Git. Полезно для объяснения рабочих процессов системы контроля версий.
Ментальные карты
Организуйте идеи, проводите мозговые штурмы и создавайте иерархические визуальные структуры. Идеально для планирования и картирования знаний.
Круговые диаграммы
Отображайте пропорциональные распределения данных с помощью круговых диаграмм. Идеально для отображения процентов и долей рынка.
Таймлайны
Визуализируйте хронологические события и вехи вдоль временной оси. Отлично подходят для истории проектов и дорожных карт.
Канбан-доски
Организуйте задачи в колонки, представляющие этапы рабочего процесса. Идеально для гибкого управления проектами и отслеживания задач.
Квадрантные диаграммы
Размещайте элементы на двухосевой сетке для сравнения и приоритизации. Идеально для приоритизации функций и стратегического анализа.
Диаграммы Санкей
Визуализируйте потоки между узлами с пропорциональными стрелками. Идеально для потоков энергии, распределения бюджета и воронок конверсии.
Блочные диаграммы
Создавайте структурированные макеты с блоками, расположенными в колонках и строках. Отлично для системной архитектуры и обзоров компонентов.
Архитектурные диаграммы
Проектируйте облачную и системную архитектуру с иконками сервисов и соединениями. Идеально для документации инфраструктуры.
Диаграммы пакетов
Визуализируйте структуры сетевых протоколов с побитовой раскладкой полей. Необходимы для документации сетевых протоколов.