sisweb/.history/src/tools/echartsToolzm_20210421111131.js

import EC from 'echarts'
import BASE from '@tools/base';
const color = ["#00FFF0","#014EB5","#A800FF","#e82edb","#B5454C","#443bff","#e8cb25","#3dffb0","#e8a425","#ff7aab","#e84b1e","#552ce2","#ffae21","#e8861e","#d441ff","#35e8e4","#9c7aff","#e86fd8","#ffee38"];

/*
 *  柱状图(非堆叠柱状图)
 *  id: 元素ID
 *  data 数据
 * [
          {
            name: "限电损失电量(单位：万kwh)",
            type: "bar",
            data: this.histogram.xdss,
          },
          {
            name: "故障损失电量(单位：万kwh)",
            type: "bar",
            data: this.histogram.gzss,
          },
          ,
          {
            name: "检修损失电量(单位：万kwh)",
            type: "bar",
            data: this.histogram.jxss,
          },
          {
            name: "性能损失电量(单位：万kwh)",
            type: "bar",
            data: this.histogram.xnss,
          },
          {
            name: "受累损失电量(单位：万kwh)",
            type: "bar",
            data: this.histogram.slss,
          },
        ]
 *  xdata :  横坐标数据
 * */
export function getBar_fdd(id, data , xdata) {
  if(data === undefined){
    message.error("没有找到报表数据，请检查！");
    return;
  }
  var myChart = EC.init(document.getElementById(id));
  var option = {
    title: {
      text: "损失电量分析",
    },
    tooltip: {
      trigger: "axis",
      axisPointer: {
        type: "shadow",
      },
    },
    legend: {
      data: [
        "限电损失电量(单位：万kwh)",
        "故障损失电量(单位：万kwh)",
        "检修损失电量(单位：万kwh)",
        "性能损失电量(单位：万kwh)",
        "受累损失电量(单位：万kwh)",
      ],
    },
    grid: {
      left: "3%",
      right: "4%",
      bottom: "3%",
      containLabel: true,
    },
    yAxis: {
      type: "value",
      boundaryGap: [0, 0.01],
    },
    xAxis: {
      type: "category",
      data: xdata,
    },
    series: data,
  };
  myChart.setOption(option, true);
}
/**
 * 
 * @param {id名称} id 
 * @param {第一台风机数据} value1 
 * @param {第一台风机名字} name1 
 * @param {第二台风机数据} value2 
 * @param {第二台风机名字} name2 
 * @returns 
 */
export function leida_tc(id , value1 , name1 , value2 , name2) {
  if(value1 === undefined || value2 === undefined){
    message.error("没有找到报表数据，请检查！");
    return;
  }
  var myChart = EC.init(document.getElementById(id));
var option;

      option = {
        title: {
          text: "对标排名分析",
          left: 400,
          top: -5,
          textStyle: {
            fontSize: 13,
          },
        },
        grid: {
          top: "10%",
          left: "10%",
          right: "10%",
          bottom: "0",
        },
        tooltip: {},
        legend: {
          orient: "vertical",
          x: "left", //可设定图例在左、右、居中
          y: "0", //可设定图例在上、下、居中
          padding: [0, 50, 0, 0],
        },
        radar: {
          // shape: 'circle',
          name: {
            textStyle: {
              color: "#fff",
              backgroundColor: "#999",
              borderRadius: 3,
              padding: [3, 5],
            },
          },
          indicator: [
            { name: "风能利用率", max: 100 },
            { name: "故障损失率", max: 100 },
            { name: "检修损失率", max: 100 },
            { name: "弃风率", max: 100 },
            { name: "性能损失率", max: 100 },
            { name: "受累损失率", max: 100 },
            { name: "复位及时率", max: 100 },
            { name: "状态转换率", max: 100 },
            { name: "消缺及时率", max: 100 },
          ],
        },
        series: [
          {
            name: "预算 vs 开销（Budget vs spending）",
            type: "radar",
            // areaStyle: {normal: {}},
            data: [
              {
                value: value1,
                name: name1,
              },
              {
                value: value2,
                name: name2,
              },
            ],
          },
        ],
      };
      
  myChart.setOption(option, true);
}
/**
 * 
 * @param {id名称} id 
 * @param {第一台风机数据} value1 
 * @param {第二台风机数据} value2 
 * @returns 
 */
export function bar_tc(id , value1 , value2) {
  if(value1 === undefined || value2 === undefined){
    message.error("没有找到报表数据，请检查！");
    return;
  }
  var myChart = EC.init(document.getElementById(id));
  var option;
  option = {
    tooltip: {
      trigger: "axis",
      axisPointer: {
        type: "cross",
        crossStyle: {
          color: "#999",
        },
      },
    },
    title: {
      text: "损失电量分析",
      left: 100,
      top: 8,
      textStyle: {
        fontSize: 13,
      },
    },
    grid: {
      top: "90",
      left: "10%",
      right: "10%",
      bottom: "30",
    },
    legend: {
      orient: "vertical",
      x: "right", //可设定图例在左、右、居中
      y: 0, //可设定图例在上、下、居中
      padding: [0, 50, 200, 0],
      data: [
        "限电损失电量(单位：万kwh)",
        "故障损失电量(单位：万kwh)",
        "检修损失电量(单位：万kwh)",
        "性能损失电量(单位：万kwh)",
        "受累损失电量(单位：万kwh)",
      ],
    },
    xAxis: [
      {
        type: "category",
        data: [
          BASE.getBzDate(new Date(value1.recordDate),0),
          BASE.getBzDate(new Date(value2.recordDate),0),
        ],
        axisPointer: {
          type: "shadow",
        },
      },
    ],
    yAxis: [
      {
        type: "value",
        name: "电量",

        interval: 50,
        axisLabel: {
          formatter: "{value} 万kw",
        },
      },
    ],
    series: [
      {
        name: "限电损失电量(单位：万kwh)",
        type: "bar",
        yAxisIndex: 0,
        data: [value1.xdss, value2.xdss],
      },
      {
        name: "故障损失电量(单位：万kwh)",
        type: "bar",
        yAxisIndex: 0,
        data: [value1.zzss, value2.gzss],
      },
      {
        name: "检修损失电量(单位：万kwh)",
        type: "bar",
        yAxisIndex: 0,
        data: [value1.jxss, value2.jxss],
      },
      {
        name: "性能损失电量(单位：万kwh)",
        type: "bar",
        yAxisIndex: 0,
        data: [value1.xnss, value2.xnss],
      },
      {
        name: "受累损失电量(单位：万kwh)",
        type: "bar",
        yAxisIndex: 0,
        data: [value1.slss, value2.slss],
      },
    ],
  };

    
      
  myChart.setOption(option, true);
}
/**
 * 
 * @param {id名称} id 
 * @param {数据} value 
 * @returns 
 */
export function bar_tc_2(id  , value) {
  if(value === undefined){
    message.error("没有找到报表数据，请检查！");
    return;
  }
  var myChart = EC.init(document.getElementById(id));
let option = {
  legend: {
    orient: "vertical",
    left: "right",
  },
  tooltip: {},
  dataset: {
    dimensions: [
      "product",
      "限电损失电量单位:万KWh",
      "故障损失电量单位:万KWh",
      "检修损失电量单位:万KWh",
      "性能损失电量单位:万KWh",
      "受累损失电量单位:万KWh",
    ],
    source: this.sortInOrde2,
  },
  xAxis: { type: "category" },
  yAxis: {},
  // Declare several bar series, each will be mapped
  // to a column of dataset.source by default.
  series: [
    {
      // barGap:'100%',/*多个并排柱子设置柱子之间的间距*/
      type: "bar",
      barWidth: 30,
      itemStyle: {
        normal: {
          color: "#D201D8",
        },
      },
    },
    {
      type: "bar",
      barWidth: 30,
      itemStyle: {
        normal: {
          color: "#FD0100",
        },
      },
    },
    {
      type: "bar",
      barWidth: 30,
      itemStyle: {
        normal: {
          color: "#FF7B16",
        },
      },
    },
    {
      type: "bar",
      barWidth: 30,
      itemStyle: {
        normal: {
          color: "#8085E9",
        },
      },
    },
    {
      type: "bar",
      barWidth: 30,
      itemStyle: {
        normal: {
          color: "#A6A6A6",
        },
      },
    },
  ],
};
myChart.setOption(option, true);
}

export default {
  getBar_fdd,
  leida_tc,
  bar_tc,
  bar_tc_2,
  color,
}