Chart-Maker — Веб-приложение для построение графиков и диаграмм в браузере

Онлайн / Офлайн генератор, 21 тип графиков и диаграмм, экспорт в PNG JPEG WEBP AVIF SVG, журнал, подробная инструкция, установка приложения

Пользователям Приложения
Приложение Chart-Maker
Разработчикам Библиотеки
Библиотеки Chart-Maker
Параметры графика
JSON
Предпросмотр
Как пользоваться — подробная инструкция

Панель «Параметры графика» содержит все элементы управления, а рядом — живой предпросмотр, который обновляется автоматически при каждом изменении. На широком экране они располагаются рядом, а на телефоне — друг под другом: предпросмотр под настройками.

Порядок работы: 1) выберите тип графика; 2) введите заголовок и название набора данных; 3) заполните данные в таблице ниже; 4) при необходимости отмените или повторите изменения; 5) откройте «Экспорт», чтобы скачать картинку или сохранить проект.

Всего 21 тип, сгруппированы по способу ввода данных:

  • Подпись / значение: столбчатая, линейная, с областью, горизонтальная, круговая, кольцевая, радар, полярная, облако слов.
  • Точки X / Y: точечная (X, Y), пузырьковая (X, Y, размер).
  • Несколько наборов: с накоплением, сгруппированная, мультилинейная, комбинированная (у каждого набора свой тип — столбцы или линия).
  • Категория и список значений: ящик с усами, скрипичная.
  • Иерархия: древовидная карта (подпись, значение, группа).
  • Сетка: тепловая карта (X, Y, значение).
  • Потоки: санки (откуда, куда, поток).
  • Карта: картограмма (страна из списка, значение).

Таблица данных подстраивается под выбранный тип. «Добавить строку» добавляет запись, крестик — удаляет.

  • Подпись / значение: подпись и число.
  • Точки: X и Y (для пузырьковой ещё размер).
  • Несколько наборов: категории задаются через запятую, значения каждого набора — списком чисел через запятую; в комбинированной у каждого набора выбирается столбцы или линия.
  • Ящик / скрипичная: в поле значений — список чисел через запятую.
  • Тепловая карта: X, Y (категории) и значение.
  • Санки: откуда, куда и величина потока.
  • Картограмма: страна выбирается из выпадающего списка (названия — на языке интерфейса), плюс значение.

Кнопка «Экспорт» открывает окно.

  • Формат: PNG, JPEG, WEBP, AVIF (настоящий формат, кодируется в браузере — при первом использовании подгружается кодировщик) и SVG (векторный).
  • Ширина и высота — размер картинки в пикселях; пусто — текущий размер графика.
  • Скачать изображение — сохраняет картинку; в неё добавляются фон и список данных под графиком.
  • Сохранить проект — файл .json со всеми настройками; флажок «Включить историю и журнал» добавляет их в файл.

Кнопка «Импорт» открывает окно с зоной, куда можно перетащить файл проекта .json или нажать и выбрать его. После выбора файла кнопка «Применить проект» станет активной и загрузит настройки (а также историю и журнал, если они были сохранены).

  • Ctrl/Cmd + Z — отменить
  • Ctrl/Cmd + Y или Ctrl/Cmd + Shift + Z — повторить
  • Ctrl/Cmd + S — сохранить проект
  • Ctrl/Cmd + E — окно экспорта
  • Ctrl/Cmd + O — окно импорта
  • Ctrl/Cmd + J — журнал
  • Ctrl/Cmd + , — настройки

В полях ввода Ctrl+Z и Ctrl+Y работают как обычное редактирование текста.

  • Отмена / Повтор: откатывают и возвращают изменения данных и параметров.
  • Журнал: хранит действия, подсказки и ошибки; его можно очистить.