简介

参照 echarts-for-react ，将echarts简单封装成了一个React组件，方便在React栈中使用

安装

yarn add echarts-for-react

使用

import ReactEcharts from 'react-for-echarts'

<ReactEcharts
        style={{
          height: 400,
          width: 400,
        }}
        option={option}
        loadingOption={loadStyle}
        showLoading={true/false}
        notMerge={true/false}
        eventsObj={
          click:()=>{},
          legendselectchanged:()=>{},  
        }
      />

API介绍

option:object / notMerge:boolean / lazyUpdate:boolean

对应 echartsInstance.setOption(option: Object, notMerge?: boolean, lazyUpdate?: boolean)

style:object

包裹echarts的div的style

showLoading:boolean / loadingOption:object

对应 echartsInstance.showLoading(loadingOption)/echartsInstance.hideLoading

eventObj:object

对应 echartsInstance.on的集合，如：

echartsInstance.on("click",()=>{})
echartsInstance.on("legendselectchanged",()=>{})

eventObj：

eventsObj={
  click:()=>{},
  legendselectchanged:()=>{},  
}

注意： 暂不支持筛选条件

chart.on('mouseover', {seriesName: 'uuu'}, function () {
  //series name 为 'uuu' 的系列中的图形元素被 'mouseover' 时，此方法被回调。
});

Fork后如何运行

yarn add
yarn start

打开 http://localhost:8001/ 即可

Issues和PR

请移至 echarts-for-react 提相关PR和Issues