一、概述
Ant Design Pro 提供了由设计师精心设计抽象的图表类型,是在 BizCharts 图表库基础上的二次封装,同时提供了业务中常用的图表套件,可以单独使用,也可以组合起来实现复杂的展示效果。
目前一共包涵 10 个图表类型,以及 2 个图表套件:
饼状图(Pie)
柱状图(Bar)
仪表盘(Gauge)
雷达图(Radar)
标签云(TagCloud)
水波图(WaterWave)
迷你柱状图(MiniBar)
迷你区域图(MiniArea)
迷你进度条(MiniProgress)
带有时间轴的折线图(TimelineChart)
图表卡片(ChartCard)
图表字段(Field)
二、详细
2.1、使用 Ant Design Pro 的图表
Charts 图表套件是在 components/Charts 包中,引用到项目就像使用其它组件一样:
你也可以通过单独使用 pro 的包的方式使用图表组件:独立使用 Pro 组件
import { ChartCard, MiniBar } from 'components/Charts';
import { Tooltip, Icon } from 'antd';
const visitData = [
{
x: "2017-09-01",
y: 100
},
{
x: "2017-09-02",
y: 120</