Chart components are built on ECharts. Install it as a dependency:

npm install echarts

For optimal bundle size, import only the ECharts components you need. The examples below show the minimum required imports for our use cases.

import * as echarts from 'echarts/core';import {  BarChart,  LineChart,  MapChart,  PieChart,  ScatterChart} from 'echarts/charts';import {  AriaComponent,  AxisPointerComponent,  BrushComponent,  GeoComponent,  GridComponent,  TooltipComponent} from 'echarts/components';import { CanvasRenderer } from 'echarts/renderers';echarts.use([  BarChart,  LineChart,  PieChart,  MapChart,  ScatterChart,  AxisPointerComponent,  BrushComponent,  GeoComponent,  GridComponent,  TooltipComponent,  CanvasRenderer,  AriaComponent]);

Available Charts

Timeseries Chart
A specialized chart for displaying time-based data.

Loading example...

Bubble Map
Plot proportional bubbles over a GeoJSON map.

Loading example...

Custom Chart
Examples like pie charts.

Loading example...

Color System

Color Palette
Information about our color system.

Legend

Use LegendItem to display chart series information with color indicators.

LargeItem

SmallItem

Loading example...