Brock UI

Редактируемые React-компоненты для графиков и данных — заберите код и вставьте прямо в свой проект. Их делает Алмас Касымжанов — дата-журналист, аналитик, разработчик и предприниматель — для тех, кто занимается тем же: журналистов, фронтенд-разработчиков и дизайнеров дата-визуализации. Каждый компонент он использует в своей повседневной работе, а набор растёт вместе с ней.

Компоненты

Открытый код, установка через shadcn-реестр. Откройте карточку, чтобы увидеть живую студию, код и документацию.

Column chart with 7 data points. Highest: 6 (215); lowest: 0 (142).
Data table.
LabelValue
Bar 1142
Bar 2168
Bar 3187
Bar 4159
Bar 5203
Bar 6178
Bar 7215
Column ChartNEW

Вертикальные столбцы для упорядоченных категорий – время и рейтинги.

Bar chart with 4 data points. Highest: Direct (4,120); lowest: Email (940).
Data table.
LabelValue
Direct4,120
Search3,870
Social1,290
Email940
Bar ChartNEW

Горизонтальные полосы для ранжированных категорий.

Line chart with 1 series. Series: high 205 at 6, low 120 at 0.
Data table.
XSeries
0120
1138
2131
3159
4172
5188
6205
Line ChartNEW

Многорядные тренды с прямыми подписями и честными разрывами.

Скоро

Area ChartStacked Bar ChartPie ChartDonut ChartHistogramScatter PlotHeatmapFunnel ChartMetric Card