sourcecode/front/src/components/PieChart/index.js

import React from 'react';
import './index.less';
import echarts from 'echarts/lib/echarts';
import ReactEchartsCore from 'echarts-for-react/lib/core';
import 'echarts/lib/chart/pie';
import 'echarts/lib/component/tooltip';
import 'echarts/lib/component/title';
import 'echarts/lib/component/legend';

function PieChart(props) {
  const { className = '', theme = 'shine', option = {}, data = [], width, height } = props;
  let defaultOption = {
    series: [
      {
        data: [],
        type: 'pie',
      },
    ],
    xAxis: {
      type: 'key',
    },
    yAxis: {
      type: 'value',
    },
  };
  if (data.length > 0) {
    defaultOption.series.data = data;
  } else {
    defaultOption = option;
  }
  const style = {};
  if (width) style.width = width;
  if (height) style.height = height;
  return (
    <div className={`pie-chart ${className}`}>
      <ReactEchartsCore
        echarts={echarts}
        option={defaultOption}
        style={style}
        opts={style}
        notMerge
        lazyUpdate
        theme={theme}
      />
    </div>
  );
}
export default PieChart;