精读 echarts-for-react 源码

引言 echarts 可以轻松实现数据可视化图表,在工作中我通常使用其 React 封装版本 echarts-for-react 让我们看一下它的封装思路。 简介 echarts-for-react 提供了 option 属性传入图表配置项,API 如下: import ReactEcharts from "echarts-for-react"; import React from "react"; const Component = () => { const getOption = () => { return { title: { text: "ECharts 入门示例", }, tooltip: {}, legend: { data: ["销量"], }, xAxis: { data: ["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"], }, yAxis: {}, series: [ { name: "销量", type: "bar", data: [5, 20, 36, 10, 10, 20], }, ], }; }; return <ReactEcharts option={getOption()} />; }; 与官方 5 分钟上手 Echarts 不同的是,echarts-for-react 不需要设置宽高的实例容器,初始化 echarts 实例,并通过 setOption 方法生成图形。...

九月 29, 2020 · 3 分钟 · 590 字