图表与数据

Recharts

用 React 组件组合出声明式图表。

访问官网 GitHub

简介

基于 React 与 D3 模块构建的图表库，用 JSX 组合坐标轴、图形和图例，适合希望图表也遵循 React 数据流与组件结构的界面。

安装

npm install recharts

命令用于快速开始，具体版本与配置请以官方文档为准。

适用场景

在 React 仪表盘中组合常规图表
用组件 props 控制坐标与样式
让图表融入现有设计系统

特点

图表结构以 JSX 表达，可读性较好
与 React 状态和组件复用方式一致
内置常用图表与响应式容器

专属示例

真实运行

刷选联动图表

Recharts 的 Brush 拖出时间区间后，主图表与其他图表同步筛选，联动的是同一份数据源。