antdesign 柱状图_010-ant design pro advanced 图表

一、概述

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},

{

x:"2017-09-03"