A React wrapper over ECharts.
Demo http://fe.jimu.io/echarts-autofit/
Notice, create a container element to define the width/height for the chart!
import EChartsAutofit from "@jimengio/echarts-autofit";
<div className={styleArea}>
<EChartsAutofit options={chartOptions} />
</div>;
let styleArea = css`
margin-top: 100px;
width: 80%;
height: 400px;
background-color: hsl(200, 70%, 50%, 0.1);
`;
SVG renderer:
<EChartsAutofit className={height100Percent} options={this.getChartOption()} renderer="svg" />
Bind events:
<EChartsAutofit options={this.options} events={{ click: this.onChartClick }} />
Do something when chart instance is ready:
<EChartsAutofit options={this.getOptions()} onReady={this.onReady} />;
onReady = (chart: ECharts) => {
this.chart = chart;
};
https://github.com/jimengio/ts-workflow
MIT