react-echarts使用總結

安裝echarts-for-react

安裝下面兩個包

• npm install echarts-for-react -S
• npm install echarts -S

引入echarts

- import ReactEcharts from 'echarts-for-react';
- import echarts from 'echarts'
複製代碼

引入圖表dom

<ReactEcharts notMerge={true}
lazyUpdate={true} option={this.getAidOption()}  />
複製代碼

• option是配置項，具體根據須要查看echarts官網api
• 當頁面上有兩個圖表數據來回切換的時候，兩個表的數據會重疊，解決辦法：
  • notMerge={true} lazyUpdate={true} 加上這兩個屬性便可。
• 若是想顯示座標軸所有數據，能夠在配置項中把座標軸間隔設置爲0

  axisLabel: {
           show: true,
           interval: 0,//座標顯示間隔
           textStyle: {
               color: '#666666',
               fontSize: 10,
           },
           showMaxLabel: true
       }
  複製代碼