diff --git a/README.md b/README.md index d445906..2805b8d 100644 --- a/README.md +++ b/README.md @@ -63,6 +63,98 @@ import ReactECharts from 'echarts-for-react'; // or var ReactECharts = require( Import ECharts.js modules manually to reduce bundle size +**With Echarts.js v5:** + +```ts +import React from 'react'; +// import the core library. +import ReactEChartsCore from 'echarts-for-react/lib/core'; +// Import the echarts core module, which provides the necessary interfaces for using echarts. +import * as echarts from 'echarts/core'; +// Import charts, all with Chart suffix +import { + // LineChart, + BarChart, + // PieChart, + // ScatterChart, + // RadarChart, + // MapChart, + // TreeChart, + // TreemapChart, + // GraphChart, + // GaugeChart, + // FunnelChart, + // ParallelChart, + // SankeyChart, + // BoxplotChart, + // CandlestickChart, + // EffectScatterChart, + // LinesChart, + // HeatmapChart, + // PictorialBarChart, + // ThemeRiverChart, + // SunburstChart, + // CustomChart, +} from 'echarts/charts'; +// import components, all suffixed with Component +import { + // GridSimpleComponent, + GridComponent, + // PolarComponent, + // RadarComponent, + // GeoComponent, + // SingleAxisComponent, + // ParallelComponent, + // CalendarComponent, + // GraphicComponent, + // ToolboxComponent, + TooltipComponent, + // AxisPointerComponent, + // BrushComponent, + TitleComponent, + // TimelineComponent, + // MarkPointComponent, + // MarkLineComponent, + // MarkAreaComponent, + // LegendComponent, + // LegendScrollComponent, + // LegendPlainComponent, + // DataZoomComponent, + // DataZoomInsideComponent, + // DataZoomSliderComponent, + // VisualMapComponent, + // VisualMapContinuousComponent, + // VisualMapPiecewiseComponent, + // AriaComponent, + // TransformComponent, + // DatasetComponent, +} from 'echarts/components'; +// Import renderer, note that introducing the CanvasRenderer or SVGRenderer is a required step +import { + CanvasRenderer, + // SVGRenderer, +} from 'echarts/renderers'; + +// Register the required components +echarts.use( + [TitleComponent, TooltipComponent, GridComponent, BarChart, CanvasRenderer] +); + +// The usage of ReactEChartsCore are same with above. + +``` + +**With Echarts.js v3 or v4:** + ```ts import React from 'react'; // import the core library.