eChartData.js 1.61 KB
Newer Older
DarkForst's avatar
DarkForst committed
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80
export const pieChartData = (opts = {}) => {
  const groupByType = opts.data;
  const colorList = ['#1890FF', '#FF4E00', '#85C700', '#9B9B9B'];
  let totalValue = 0;

  const data = groupByType.map(item => {
    totalValue += item.totalValue;
    return {
      name: item.name,
      value: item.totalValue,
    };
  });

  const getArrayValue = (array, key) => {
    const keyIndex = key || 'value';
    const res = [];
    if (array) {
      array.forEach( t => {
        res.push(t[keyIndex]);
      });
    }
    return res;
  }
  const array2obj = (array, key) => {
    const resObj = {};
    const {length} = array;
    for (let i = 0; i < length; i += 1) {
      resObj[array[i][key]] = array[i];
    }
    return resObj;
  }

  const arrName = getArrayValue(data, 'name');
  let objData = array2obj(data, 'name');

  return {
    tooltip: {
      trigger: 'item',
      formatter: '{b}: {c}',
    },
    title: {
      text: '设备故障率',
      left: '58%',
      top: '35%',
      textStyle: {
        color: '#59A7EE'
      }
    },
    legend: {
      orient: 'vertical',
      show: true,
      selectedMode: true,
      left: '58%',
      top: '45%',
      data: arrName,
      icon: 'circle',
      textStyle: {
        fontSize: 12,
      },
    },
    series: [
      {
        type: 'pie',
        radius: '50%',
        center: ['30%', '55%'],
        itemStyle: {
          color: (params) => {
            return colorList[params.dataIndex];
          },
          shadowBlur: 20,
          shadowColor: 'rgba(0, 0, 0, 0.3)',
        },
        label: {
          show: false,
        },
        data,
      },
    ],
  };
};