Repolode
Предложить
frappe

frappe/charts

JavaScript-библиотека без зависимостей для создания простых адаптивных SVG-графиков в стиле GitHub.

Открыть на GitHubСайт
Звёзды
15,093
Форки
756
Открытые issues
150
Последний коммит
19 дней назад

Что это?

Frappe Charts — библиотека для построения графиков в браузере, которая преобразует массивы значений в SVG-графики. Она предлагает небольшой и простой API, а её визуальный стиль вдохновлён графиками на GitHub. Библиотека не имеет runtime-зависимостей.

Библиотека поддерживает осевые, площадные и трендовые графики, столбчатые, линейные, круговые и процентные диаграммы, графики со смешанными осями и тепловые карты. В графики можно добавлять маркеры по осям x и y, области и подсказки. Отдельные точки данных можно добавлять, удалять и обновлять на месте, а также заменять весь набор данных. Можно настраивать цвета, анимацию и заголовки.

Библиотеку можно установить из npm, импортировать как ES-модуль или загрузить напрямую с CDN с помощью тега script для UMD. Изначально она была создана для проекта ERPNext, которому нужна была более простая библиотека для графиков, чем существовавшие решения.

Ключевые возможности

  • 01Поддерживает осевые, площадные и трендовые графики, столбчатые, линейные, круговые и процентные диаграммы, графики со смешанными осями и тепловые карты
  • 02Позволяет добавлять маркеры по осям x и y, области и подсказки для аннотаций
  • 03Обновляет отдельные точки данных на месте или заменяет весь набор данных
  • 04Позволяет настраивать цвета, анимацию и заголовки
  • 05Не имеет зависимостей и распространяется через npm или CDN

Сценарии использования

  • Добавление простых графиков продаж или активности в веб-панель
  • Отображение графиков в административном интерфейсе или интерфейсе в стиле ERP без тяжёлых библиотек для визуализации
  • Встраивание лёгких SVG-графиков на страницы, где важен размер бандла

Быстрый старт

  1. 1

    Установите пакет из npm

    npm install frappe-charts
  2. 2

    Импортируйте класс Chart и его CSS в проект

    import { Chart } from 'frappe-charts'
  3. 3

    Создайте диаграмму в контейнере, указав параметры data, type и height

В подборках

Фронтенд-фреймворки и UI-компонентыКурсы и инструменты для анализа данных

Темы

#charts#svg#data-visualization#javascript#zero-dependency#frontend#chart#graph#hacktoberfest#svg-chart

Частые вопросы

Что такое charts?
JavaScript-библиотека без зависимостей для создания простых адаптивных SVG-графиков в стиле GitHub. Frappe Charts — библиотека для построения графиков в браузере, которая преобразует массивы значений в SVG-графики. Она предлагает небольшой и простой API, а её визуальный стиль вдохновлён графиками на GitHub. Библиотека не имеет runtime-зависимостей.
charts можно использовать бесплатно? Какая у него лицензия?
charts распространяется с открытым исходным кодом под лицензией MIT. Перед использованием в коммерческих продуктах проверьте условия лицензии.
charts всё ещё поддерживается?
Активно поддерживается. Последний коммит в charts — 19 окт. 2026 г..
Для чего можно использовать charts?
Добавление простых графиков продаж или активности в веб-панель Отображение графиков в административном интерфейсе или интерфейсе в стиле ERP без тяжёлых библиотек для визуализации Встраивание лёгких SVG-графиков на страницы, где важен размер бандла
Как установить charts?
Установите пакет из npm: npm install frappe-charts Импортируйте класс Chart и его CSS в проект: import { Chart } from 'frappe-charts' Создайте диаграмму в контейнере, указав параметры data, type и height
Где скачать charts?
Исходный код и инструкции по установке — на GitHub: https://github.com/frappe/charts

Описание создано ИИ на основе README проекта. Статистика GitHub обновляется ежедневно.

Похожие проекты

PhilJay / MPAndroidChart

Библиотека графиков для Android: линейные, столбчатые, круговые, радарные, пузырьковые и свечные диаграммы с масштабированием, прокруткой и анимацией, а также модуль Jetpack Compose.

Фронтенд и UI#android#charts#data-visualization
38,2 тыс.9 тыс.KotlinApache-2.0Активно поддерживаетсяОбновлён 29 дней назад