$(function () {
  // 各班满分、最高分、最低分、平均分对比分析
  function initClassScoreEcharts() {
    var xAxis_data = [
      "全年级",
      "八年级一班",
      "八年级二班",
      "八年级三班",
      "八年级四班"
    ];
    var series_full_data = [100, 100, 100, 100, 100];
    var series_max_data = [95, 80, 85, 97, 85];
    var series_min_data = [55, 60, 40, 30, 40];
    var series_avg_data = [70, 65, 60, 80, 60];
    var option = {
      animation: false,
      title: {
        text: "分",
        x: "left",
        y: "top",
        textStyle: {
          color: "#5F6E82",
          fontSize: $.UnitUtil.mm2px(3),
          fontWeight: 500,
        },
      },
      color: ["#5C99FF", "#FF5F56", "#5EC5C8", "#F1982B"],
      legend: {
        itemWidth: $.UnitUtil.mm2px(2),
        itemHeight: $.UnitUtil.mm2px(2),
        top: "bottom",
        data: ["满分", "最高分", "最低分", "平均分"],
      },
      grid: {
        top: $.UnitUtil.mm2px(10),
        left: 0,
        right: 0,
        bottom: $.UnitUtil.mm2px(8),
        containLabel: true,
      },
      xAxis: [
        {
          type: "category",
          data: xAxis_data,
          axisLabel: {
            color: "#5F6E82", //更改坐标轴文字颜色
            interval: 0
          },
          axisTick: {
            alignWithLabel: true,
          },
          boundaryGap: true,
          triggerEvent: true,
          axisLine: {
            show: true, //是否显示轴线
            lineStyle: {
              color: "#DADADA", //刻度线的颜色
            },
          },
        },
      ],
      yAxis: [
        {
          type: "value",
          axisTick: {
            show: false, //刻度
          },
          axisLine: {
            show: false, //是否显示轴线
            lineStyle: {
              color: "#DADADA", //刻度线的颜色
            },
          },
          splitLine: {
            //网格线
            lineStyle: {
              type: "dotted", //设置网格线类型 dotted：虚线   solid:实线
            },
            show: true, //隐藏或显示
          },
          axisLabel: {
            color: "#5F6E82", //更改坐标轴文字颜色
          },
        },
      ],
      series: [
        {
          name: "满分",
          type: "bar",
          barWidth: $.UnitUtil.mm2px(5),
          // 柱状图最小高度
          barMinHeight: $.UnitUtil.mm2px(2),
          barGap: 0,
          label: {
            normal: {
              show: true,
              align: "center",
              verticalAlign: "bottom",
              position: "top",
              distance: 0,
              formatter: "{c}",
            },
          },
          data: series_full_data,
        },
        {
          name: "最高分",
          type: "bar",
          barWidth: $.UnitUtil.mm2px(5),
          // 柱状图最小高度
          barMinHeight: $.UnitUtil.mm2px(2),
          barGap: 0,
          label: {
            normal: {
              show: true,
              align: "center",
              verticalAlign: "bottom",
              position: "top",
              distance: 0,
              formatter: "{c}",
            },
          },
          data: series_max_data,
        },
        {
          name: "最低分",
          type: "bar",
          barWidth: $.UnitUtil.mm2px(5),
          // 柱状图最小高度
          barMinHeight: $.UnitUtil.mm2px(2),
          barGap: 0,
          label: {
            normal: {
              show: true,
              align: "center",
              verticalAlign: "bottom",
              position: "top",
              distance: 0,
              formatter: "{c}",
            },
          },
          data: series_min_data,
        },
        {
          name: "平均分",
          type: "bar",
          barWidth: $.UnitUtil.mm2px(5),
          // 柱状图最小高度
          barMinHeight: $.UnitUtil.mm2px(2),
          barGap: 0,
          label: {
            normal: {
              show: true,
              align: "center",
              verticalAlign: "bottom",
              position: "top",
              distance: 0,
              formatter: "{c}",
            },
          },
          data: series_avg_data,
        }
      ],
    };
    var myEcharts = echarts.init(document.querySelector(".section_2_class_single #classScoreEcharts"));
    myEcharts.clear();
    myEcharts.setOption(option);
  }
  // 各班优秀率、良好率、及格率、低分率对比分析
  function initClassRateEcharts() {
    var xAxis_data = [
      "全年级",
      "八年级一班",
      "八年级二班",
      "八年级三班",
      "八年级四班"
    ];
    var series_xy_data = [80.45, 77.06, 89, 78.6, 80.6];
    var series_lh_data = [45.45, 47.06, 50, 48.6, 60.6];
    var series_jg_data = [80.45, 77.06, 89, 78.6, 80.6];
    var series_df_data = [80.45, 77.06, 89, 78.6, 80.6];
    var option = {
      animation: false,
      title: {
        text: "%",
        x: "left",
        y: "top",
        textStyle: {
          color: "#5F6E82",
          fontSize: $.UnitUtil.mm2px(3),
          fontWeight: 500,
        },
      },
      color: ["#5C99FF", "#FF5F56", "#5EC5C8", "#F1982B"],
      legend: {
        itemWidth: $.UnitUtil.mm2px(2),
        itemHeight: $.UnitUtil.mm2px(2),
        top: "bottom",
        data: ["优秀率", "良好率", "及格率", "低分率"],
      },
      grid: {
        top: $.UnitUtil.mm2px(10),
        left: 0,
        right: 0,
        bottom: $.UnitUtil.mm2px(8),
        containLabel: true,
      },
      xAxis: [
        {
          type: "category",
          data: xAxis_data,
          axisLabel: {
            color: "#5F6E82", //更改坐标轴文字颜色
            interval: 0
          },
          axisTick: {
            alignWithLabel: true,
          },
          boundaryGap: true,
          triggerEvent: true,
          axisLine: {
            show: true, //是否显示轴线
            lineStyle: {
              color: "#DADADA", //刻度线的颜色
            },
          },
        },
      ],
      yAxis: [
        {
          type: "value",
          axisTick: {
            show: false, //刻度
          },
          axisLine: {
            show: false, //是否显示轴线
            lineStyle: {
              color: "#DADADA", //刻度线的颜色
            },
          },
          splitLine: {
            //网格线
            lineStyle: {
              type: "dotted", //设置网格线类型 dotted：虚线   solid:实线
            },
            show: true, //隐藏或显示
          },
          axisLabel: {
            color: "#5F6E82", //更改坐标轴文字颜色
          },
        },
      ],
      series: [
        {
          name: "优秀率",
          type: "bar",
          barWidth: $.UnitUtil.mm2px(5),
          // 柱状图最小高度
          barMinHeight: $.UnitUtil.mm2px(2),
          barGap: 0,
          label: {
            normal: {
              show: true,
              align: "center",
              verticalAlign: "bottom",
              position: "top",
              distance: 0,
              formatter: "{c}",
            },
          },
          data: series_xy_data,
        },
        {
          name: "良好率",
          type: "bar",
          barWidth: $.UnitUtil.mm2px(5),
          // 柱状图最小高度
          barMinHeight: $.UnitUtil.mm2px(2),
          barGap: 0,
          label: {
            normal: {
              show: true,
              align: "center",
              verticalAlign: "bottom",
              position: "top",
              distance: 0,
              formatter: "{c}",
            },
          },
          data: series_lh_data,
        },
        {
          name: "及格率",
          type: "bar",
          barWidth: $.UnitUtil.mm2px(5),
          // 柱状图最小高度
          barMinHeight: $.UnitUtil.mm2px(2),
          barGap: 0,
          label: {
            normal: {
              show: true,
              align: "center",
              verticalAlign: "bottom",
              position: "top",
              distance: 0,
              formatter: "{c}",
            },
          },
          data: series_jg_data,
        },
        {
          name: "低分率",
          type: "bar",
          barWidth: $.UnitUtil.mm2px(5),
          // 柱状图最小高度
          barMinHeight: $.UnitUtil.mm2px(2),
          barGap: 0,
          label: {
            normal: {
              show: true,
              align: "center",
              verticalAlign: "bottom",
              position: "top",
              distance: 0,
              formatter: "{c}",
            },
          },
          data: series_df_data,
        }
      ],
    };
    var myEcharts = echarts.init(document.querySelector(".section_2_class_single #classRateEcharts"));
    myEcharts.clear();
    myEcharts.setOption(option);
  }
  // 各班实考人数、缺考人数对比
  function initClassExamEcharts() {
    var xAxis_data = [
      "全年级",
      "八年级一班",
      "八年级二班",
      "八年级三班",
      "八年级四班"
    ];
    var series_sk_data = [100, 100, 100, 100, 100];
    var series_qk_data = [95, 80, 85, 97, 85];
    var option = {
      animation: false,
      title: {
        text: "人",
        x: "left",
        y: "top",
        textStyle: {
          color: "#5F6E82",
          fontSize: $.UnitUtil.mm2px(3),
          fontWeight: 500,
        },
      },
      color: ["#5C99FF", "#FF5F56"],
      legend: {
        itemWidth: $.UnitUtil.mm2px(2),
        itemHeight: $.UnitUtil.mm2px(2),
        top: "bottom",
        data: ["实考人数", "缺考人数"],
      },
      grid: {
        top: $.UnitUtil.mm2px(10),
        left: 0,
        right: 0,
        bottom: $.UnitUtil.mm2px(8),
        containLabel: true,
      },
      xAxis: [
        {
          type: "category",
          data: xAxis_data,
          axisLabel: {
            color: "#5F6E82", //更改坐标轴文字颜色
            interval: 0
          },
          axisTick: {
            alignWithLabel: true,
          },
          boundaryGap: true,
          triggerEvent: true,
          axisLine: {
            show: true, //是否显示轴线
            lineStyle: {
              color: "#DADADA", //刻度线的颜色
            },
          },
        },
      ],
      yAxis: [
        {
          type: "value",
          axisTick: {
            show: false, //刻度
          },
          axisLine: {
            show: false, //是否显示轴线
            lineStyle: {
              color: "#DADADA", //刻度线的颜色
            },
          },
          splitLine: {
            //网格线
            lineStyle: {
              type: "dotted", //设置网格线类型 dotted：虚线   solid:实线
            },
            show: true, //隐藏或显示
          },
          axisLabel: {
            color: "#5F6E82", //更改坐标轴文字颜色
          },
        },
      ],
      series: [
        {
          name: "实考人数",
          type: "bar",
          barWidth: $.UnitUtil.mm2px(5),
          // 柱状图最小高度
          barMinHeight: $.UnitUtil.mm2px(2),
          barGap: 0,
          label: {
            normal: {
              show: true,
              align: "center",
              verticalAlign: "bottom",
              position: "top",
              distance: 0,
              formatter: "{c}",
            },
          },
          data: series_sk_data,
        },
        {
          name: "缺考人数",
          type: "bar",
          barWidth: $.UnitUtil.mm2px(5),
          // 柱状图最小高度
          barMinHeight: $.UnitUtil.mm2px(2),
          barGap: 0,
          label: {
            normal: {
              show: true,
              align: "center",
              verticalAlign: "bottom",
              position: "top",
              distance: 0,
              formatter: "{c}",
            },
          },
          data: series_qk_data,
        }
      ],
    };
    var myEcharts = echarts.init(document.querySelector(".section_2_class_single #classExamEcharts"));
    myEcharts.clear();
    myEcharts.setOption(option);
  }
  // 各班标准差对比分析
  function initClassStdEcharts() {
    var xAxis_data = [
      "全年级",
      "八年级一班",
      "八年级二班",
      "八年级三班",
      "八年级四班"
    ];
    var series_data = [15, 10, 3, 14, 7];
    var option = {
      animation: false,
      color: ["#5C99FF"],
      legend: {
        itemWidth: $.UnitUtil.mm2px(2),
        itemHeight: $.UnitUtil.mm2px(2),
        top: "bottom",
        data: ["标准差"],
      },
      grid: {
        top: $.UnitUtil.mm2px(10),
        left: 0,
        right: 0,
        bottom: $.UnitUtil.mm2px(8),
        containLabel: true,
      },
      xAxis: [
        {
          type: "category",
          data: xAxis_data,
          axisLabel: {
            color: "#5F6E82", //更改坐标轴文字颜色
            interval: 0
          },
          axisTick: {
            alignWithLabel: true,
          },
          boundaryGap: true,
          triggerEvent: true,
          axisLine: {
            show: true, //是否显示轴线
            lineStyle: {
              color: "#DADADA", //刻度线的颜色
            },
          },
        },
      ],
      yAxis: [
        {
          type: "value",
          axisTick: {
            show: false, //刻度
          },
          axisLine: {
            show: false, //是否显示轴线
            lineStyle: {
              color: "#DADADA", //刻度线的颜色
            },
          },
          splitLine: {
            //网格线
            lineStyle: {
              type: "dotted", //设置网格线类型 dotted：虚线   solid:实线
            },
            show: true, //隐藏或显示
          },
          axisLabel: {
            color: "#5F6E82", //更改坐标轴文字颜色
          },
        },
      ],
      series: [
        {
          name: "标准差",
          type: "bar",
          barWidth: $.UnitUtil.mm2px(5),
          // 柱状图最小高度
          barMinHeight: $.UnitUtil.mm2px(2),
          barGap: 0,
          label: {
            normal: {
              show: true,
              align: "center",
              verticalAlign: "bottom",
              position: "top",
              distance: 0,
              formatter: "{c}",
            },
          },
          data: series_data,
        }
      ]
    };
    var myEcharts = echarts.init(document.querySelector(".section_2_class_single #classStdEcharts"));
    myEcharts.clear();
    myEcharts.setOption(option);
  }
  initClassScoreEcharts();
  initClassRateEcharts();
  initClassExamEcharts();
  initClassStdEcharts();
});