Публикации по теме 'recharts'
Визуализация основных данных: готовое руководство для Recharts с React.js!
Визуализация данных является жизненно важным аспектом современной веб-разработки. Это позволяет пользователям легче воспринимать сложные данные и принимать обоснованные решения. В этом уроке я покажу вам, как интегрировать Recharts в ваш проект React.js и создать три различных типа диаграмм: столбчатую, линейную и круговую.
Recharts — это популярная библиотека диаграмм для React, простая в использовании и с широкими возможностями настройки. Итак, давайте погрузимся и научимся его..
Создание компонента React Football Heat Map с помощью Recharts
Тепловые карты - отличная визуализация для начала при изучении данных о спортивных событиях, которые включают координаты, позволяя зрителям сразу сосредоточиться на наиболее важных областях поля.
В этом посте я расскажу, как мы можем создать компонент React.js, который может отображать покрытие поля футболиста в определенных зонах для данного матча, используя библиотеку диаграмм Recharts . Я решил работать с библиотекой Recharts для этого примера, потому что на самом деле у них нет..
Вопросы по теме 'recharts'
перерисовывает центрирование круговой диаграммы с помощью адаптивного контейнера
Я использую повторные диаграммы для создания круговых диаграмм. Если посмотреть на этот пример, http://recharts.org/#/en-US/examples/PieResponsiveContainer круговую диаграмму можно центрировать с помощью компонента ResponsiveContainer.
Но моя...
6250 просмотров
schedule
29.06.2023
Recharts PieChart - каждый дочерний элемент в массиве или итераторе должен иметь уникальную ключевую опору
Я нашел много вопросов с похожими названиями, но ни один из них не касается того, как разрешить «Каждый дочерний элемент в массиве или итераторе должен иметь уникальную« ключевую »опору» в случае Recharts PieChart.
Может кто подскажет - в какую...
467 просмотров
schedule
29.12.2022
Повторные диаграммы устанавливают значение оси Y на основе отображаемого числа
Привет, я пытаюсь использовать Recharts для отображения некоторых данных, но у меня возникла проблема. Числа, которые я привязываю для отображения, слишком велики, и моя ось Y обрезается веб-страницей. Есть ли у них способ установить или настроить...
4205 просмотров
schedule
13.03.2023
Как правильно настроить xAxis на LineChart?
Я пытаюсь отобразить LineChart в Recharts, где данные являются числовыми, а xAxis также числовым, но неявным (не сохраняется в данных явно).
Этот jsFiddle иллюстрирует проблему.
Если я изменю <XAxis /> на <XAxis type="numeric"...
55 просмотров
schedule
18.04.2022
перерисовывает круговую диаграмму с метками значений внутри
используя библиотеку recharts, я хотел бы создать такую кольцевую диаграмму: https://apexcharts.com/javascript-chart-demos/pie-charts/simple-donut/
в частности, метки значений находятся внутри сегментов круговой диаграммы. единственный пример,...
5087 просмотров
schedule
23.01.2023
Почему In Barchart не показывает Yaxis, а также не показывает все ярлыки для Xaxis на повторных диаграммах?
Проблема:
Я создал гистограмму, используя повторные диаграммы. Здесь я предоставляю свой код.
import React, { Component, PureComponent } from "react";
import { bindActionCreators } from "redux";
import { connect } from "react-redux";
import...
1304 просмотров
schedule
03.05.2022
Установите минимальную / максимальную дату для даты в Recharts.js
Я использую Recharts.js для отображения данных диаграммы на моем веб-сайте. Однако я хочу установить минимальное / максимальное значение XAxis, которое является типом даты, но попытка с доменом мне не сработала:
<ResponsiveContainer...
1733 просмотров
schedule
11.11.2023
Во всплывающей подсказке Recharts отображается то же значение
У меня проблема, когда во всплывающей подсказке отображается одно и то же значение для разных серий. Поэтому всякий раз, когда я наводил курсор на всплывающее окно, я получаю следующее:
Вот моя реализация:
<LineChart margin={{ top:...
871 просмотров
schedule
25.09.2022
как вернуть теги http в функцию карты реагировать
Я пытаюсь построить динамическую гистограмму со многими уровнями. Поэтому я использовал функцию карты для создания диаграммы. я делаю консольный журнал var и прочее, он работает правильно. Но возврат тега не отображается. я пробую простой div {...
49 просмотров
schedule
01.12.2022
Пользовательская метка на радарной диаграмме Recharts
У меня чертовски много времени, пытаясь заставить пользовательские метки на радарной диаграмме recharts работать. Я пробовал делать несколько вещей в соответствии с документами, поэтому решил, что брошу это волкам. Надеюсь, один из вас укажет мне...
979 просмотров
schedule
01.08.2022
Recharts не будут автоматически рассчитывать тики YAxis
Я пытаюсь добавить диаграмму с использованием recharts с последними курсами обмена некоторых валют. Данные отображаются правильно, но диаграмма всегда начинается с 0 и идет немного выше максимального значения.
График правильный, однако не...
1445 просмотров
schedule
10.06.2023
Почему компилятор машинописного текста жалуется, что свойство «данные» не существует для типа «Только для чтения» (реквизит)?
Я изучаю машинопись, и я немного застрял в следующей ошибке:
Property 'data' does not exist on type 'Readonly<{}> & Readonly<{ children?: ReactNode; }>'. TS2339
let data = this.props.data as any;
^...
264 просмотров
schedule
08.08.2022
Recharts ComposedChart для двух разных типов данных/базовых показателей (значение/процент)
Я занимаюсь проектом, посвященным погоде, используя React и Recharts, и пытаюсь втиснуть температуру и дождь в один и тот же график.
Иллюстрация также здесь: https://imgur.com/OayH9cG
Вы можете видеть мою дилемму. Я хотел бы, чтобы...
1171 просмотров
schedule
09.10.2022
Recharts - передать массив значений компоненту Line
У меня есть такой массив значений: array = [0, 0, 1, 2, 454, 3]
Как передать массив компоненту Recharts Line? Значения должны появиться на оси y, а индекс - на оси x.
1083 просмотров
schedule
24.02.2023
Передача значений в функцию tickFormatter в Recharts BarChart
Я пытаюсь построить даты в диаграмме BarChart, для чего требуется преобразовать временные метки в соответствующие значения Unix Epoch (т.е. секунды с 1 января 1970 года). Это означает, что любые даты до 1970 г. отображаются как отрицательные числа....
1954 просмотров
schedule
28.11.2023
Как использовать строку даты в формате UTC в качестве оси пересчета и равномерно распределить ее
Мой источник данных выглядит так:
const data = [
{ dataora: "2019-10-20T04:00:00Z", valore: -0.04 },
{ dataora: "2019-10-20T05:00:00Z", valore: -0.03 },
{ dataora: "2019-10-20T06:00:00Z", valore: -0.03 },
{ dataora:...
2042 просмотров
schedule
18.02.2023
На гистограмме с накоплением Recharts неверная нумерация XAxis
Я пишу приложение React и пытаюсь использовать Recharts для отображения некоторой информации в виде столбчатой диаграммы с накоплением. Имею следующее:
const {BarChart, Bar, XAxis, YAxis, CartesianGrid, Tooltip, Legend, ResponsiveContainer} =...
577 просмотров
schedule
12.05.2023
Крошечная диаграмма во всю ширину с Recharts
Я пытаюсь прикрепить диаграмму к границе моего контейнера с Recharts. Я не использую никакую ось, только линию. Я не могу избавиться от маржи.
Простое воспроизведение здесь: https://jsfiddle.net/jdcpqg5k/2
import React from...
182 просмотров
schedule
20.05.2022
Диаграмма разброса Recharts показывает наименьшее значение x во всплывающей подсказке при изменении размера диаграммы
Я использую точечную диаграмму Recharts, чтобы нарисовать пузырьковую диаграмму. В соответствии с требованиями размер диаграммы должен увеличиваться в два раза по высоте или ширине. До изменения размера все нормально. Но после изменения размера...
159 просмотров
schedule
06.07.2023
Показывать только 2 цифры года на оси X Recharts
На моем графике данных Recharts, содержащем строки даты, ось X выглядит довольно запутанной.
Можно ли настроить Recharts для маркировки оси только двумя последними цифрами года? Например, 17 , 18 , 19 , 20 без повторения метки для...
64 просмотров
schedule
21.07.2023
