Home Arrow Icon Knowledge base Arrow Icon Global Arrow Icon React Charting Пример кода


React Charting Пример кода


Вот несколько примеров библиотек схемы реагирования с их соответствующими функциями и примерами:

1. React chartjs 2

- Особенности: различные типы диаграмм, такие как линия, бар, пирог и многое другое.
- Примеры:
- вертикальная барная карта
- горизонтальная барная схема
- Сложная барная карта
- сгруппированная барная карта
- Районный диаграмма
- Линейная диаграмма
- Диаграмма Multiaxis Line
- круговая диаграмма
- Диаграмма пончиков
- диаграмма полярной зоны
- Радарная карта
- рассеянный график
- пузырьковая диаграмма
- MultityPe диаграмма
- События диаграммы
- диаграмма ref
- градиентная диаграмма

2. React Google диаграммы

- Особенности: различные типы графиков, такие как область, бар, пузырь и многое другое.
- Примеры:
- Районный диаграмма
- Барная карта
- пузырьковая диаграмма
- Календарь
- Диаграмма подсвечника
- Диаграмма столбцов
- комбинированная диаграмма
- Гантт
- Измерять
- Гео -диаграмма
- гистограмма
- Линейная диаграмма
- Орг -диаграмма
- круговая диаграмма
- Санки
- рассеянный график
- Таблица ступенчатой ​​зоны
- Стол
- временная шкала
- Карта дерева
- дерево слов
- анимация
- Редактор диаграммы
- Управление
- взаимодействия
- Макет
- таблица
- Панель инструментов

3. Apexcharts.js

- Особенности: различные типы диаграмм, такие как линия, колонка, бар, пирог и многое другое.
- Примеры: включает исходный код для всех примеров, чтобы сэкономить время разработки.

4. Canvasjs

- Особенности: интерактивные, отзывчивые диаграммы с анимацией, масштабированием, панорамированием, событиями, экспортом, тренировкой и обновлениями в реальном времени.
- Примеры:
- Линейные диаграммы
- Сплайн и графики поэтапной линии
- Области диаграммы
- Площадь сплайна, сложенная область, сложенная площадь 100, площадь шага, зона ареала и диаграммы зоны сплайна
- Диаграммы столбцов
- Бар -карты
- Сложный столбец, Сложный столбец 100%, столбец диапазона, сложенная стержень, сложенная полоса 100%, диапазон и диаграммы водопада
- круговые диаграммы
- Диаграммы пончиков / пончиков
- графики воронки и пирамиды
- Диаграммы Candlestick и OHLC
- рассеяние и пузырьковые диаграммы
- Коробка и схемы усов
- Диаграммы ошибок и строки ошибок
- Динамические диаграммы
- Стоковые диаграммы с селектором диапазона, навигатором и несколькими диаграммами

5. Tanstack/React-Charts

- Особенности: различные типы графиков, такие как линия, бар, пузырь и многое другое.
- Примеры: включает в себя примеры для простых, линии, стержня, пузырька, области, пользовательских стилей, пользовательских подсказков, параметров оси, темного режима, игрирования, чистки, режимов группировки, параметров подсказки и многого другого.

Эти библиотеки предоставляют обширные примеры и шаблоны, которые помогут вам начать работу с созданием диаграмм в вашем приложении React. Вы можете выбрать тот, который наилучшим образом соответствует вашим потребностям в зависимости от типов диаграмм, которые вы хотите создать, и уровня настройки, который вам требуется [1] [2] [3] [4] [5].

Цитаты:
[1] https://react-chartjs-2.js.org/examples/
[2] https://www.react-google-charts.com/examples
[3] https://apexcharts.com/react-chart-demos/
[4] https://canvasjs.com/react-charts/
[5] https://codesandbox.io/examples/package/react-charts