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

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

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

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

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

Усього 29 тип, згруповані за способом уведення даних:

  • Підпис / значення: стовпчаста, лінійна, з областю, горизонтальна, кругова, кільцева, радар, полярна, хмара слів.
  • Точки X / Y: точкова (X, Y), бульбашкова (X, Y, розмір).
  • Кілька наборів: з накопиченням, згрупована, мультилінійна, комбінована (кожен набір — стовпці або лінія).
  • Категорія і список значень: ящик з вусами, скрипкова.
  • Ієрархія: деревовидна карта (підпис, значення, група).
  • Сітка: теплова карта (X, Y, значення).
  • Потоки: санкі (звідки, куди, потік).
  • Карта: картограма (країна зі списку, значення).
  • Стовпчаста з похибками
  • Свічковий / OHLC
  • Воронка
  • Венна
  • Граф (мережа)
  • Індикатор
  • Функція (y = f(x))

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

  • Підпис / значення: підпис і число.
  • Точки: X і Y (для бульбашкової ще розмір).
  • Кілька наборів: категорії через кому, значення кожного набору — списком чисел через кому; у комбінованій у кожного набору обирається стовпці або лінія.
  • Ящик / скрипкова: у полі значень — список чисел через кому.
  • Теплова карта: X, Y (категорії) і значення.
  • Санкі: звідки, куди і величина потоку.
  • Картограма: країна обирається з випадного списку (назви — мовою інтерфейсу), плюс значення.
  • Стовпчаста з похибками: Підпис, Значення, Похибка.
  • Свічковий / OHLC: Дата, O/H/L/C.
  • Воронка: Підпис, Значення.
  • Венна: Множини (через кому), Значення.
  • Граф (мережа): Вузли (через кому), Звідки/Куди.
  • Індикатор: Значення, Макс.
  • Тип Функція будує графік y = f(x). Введіть вираз — наприклад sin(x), x^2, sqrt(x) — діапазон X (мін і макс) та кількість точок. Функція обчислює вираз і малює криву; формула також показується в списку даних під графіком.

Кнопка «Експорт» відкриває вікно.

  • Формат: PNG, JPEG, WEBP, AVIF (справжній формат, кодується у браузері — кодувальник завантажується при першому використанні), SVG (вектор) і PDF (сторінка розміром із зображення; кодувальник завантажується при першому використанні).
  • Ширина та висота — точний піксельний розмір збереженого файлу; порожнє — поточний розмір графіка.
  • Включити дані — додає до зображення список даних під графіком.
  • Завантажити зображення — зберігає картинку з непрозорим фоном, що відповідає графіку.
  • Друк — відкриває діалог друку браузера з графіком як зображенням; звідти можна надрукувати або вибрати «Зберегти як PDF».
  • Зберегти проєкт — файл .json з усіма налаштуваннями; прапорець «Включити історію та журнал» додає їх до файлу.
  • у combo/multi кожен набір може використовувати ліву або праву вісь Y.

Кнопка «Імпорт» відкриває вікно із зоною, куди можна перетягнути файл проєкту .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 працюють як звичайне редагування тексту.

  • Скасувати / Повторити: відкочують і повертають зміни даних та параметрів.
  • Журнал: зберігає дії, підказки та помилки; його можна очистити.

Розділ «Додатково» над таблицею даних групує необов’язкові налаштування: підзаголовок; згладжування, ступінчасті, штрихові та залиті лінії; накопичувальна та логарифмічна вісь Y; проріджування; позиція легенди; розмір точок і товщина лінії; тривалість та згладжування анімації; а також ефекти на вимогу — підписи значень, масштаб/панорама, анотації, лінія тренду і перехрестя. У combo та multi кожен набір може використовувати ліву чи праву вісь Y. Кожен параметр з’являється лише для типів, яких він стосується.

Кольори. У блоці «Фон холста» можна задати фон (прозорий, колір або зображення) та окремо перевизначити кольори: графіка (серії), ліній сітки, цифр і підписів на осях, заголовка, тексту набору/легенди, а також тексту списку даних і його фону. «Скинути» повертає всі кольори до теми. Усе це зберігається в проєкті.