schoolReportPDF/js/scoreAnalysis/section_2_lin.js

$(function () {
  // 按名次统计
  function initClassCriticalRankEcharts() {
    var legend_data = [">10名", "≤10名"];
    var xAxis_data = ["全部班级", "九年级一班", "九年级二班"];
    var series_data1 = [7, 4, 3];
    var series_data2 = [-4, -2, -2];
    var option = {
      title: {
        text: "人",
        x: "left",
        y: "top",
        textStyle: {
          color: "#5F6E82",
          fontSize: 12,
          fontWeight: 500
        }
      },
      color: ["#5C99FF", "#F39A2C"],
      legend: {
        itemWidth: 6,
        itemHeight: 6,
        bottom: 30,
        data: legend_data
      },
      grid: {
        top: 30,
        left: 5,
        right: 0,
        bottom: 65,
        containLabel: true
      },
      xAxis: [
        {
          type: "category",
          offset: 10,
          position: "bottom",
          data: xAxis_data,
          axisLabel: {
            color: "#5F6E82" //更改坐标轴文字颜色
          },
          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: legend_data[0],
          type: "bar",
          stack: "one",
          barWidth: 32,
          // 柱状图最小高度
          barMinHeight: 0,
          barGap: 0,
          label: {
            normal: {
              show: true,
              align: "center",
              verticalAlign: "bottom",
              position: "top",
              distance: 0
            }
          },
          data: series_data1
        },
        {
          name: legend_data[1],
          type: "bar",
          stack: "one",
          barWidth: 32,
          // 柱状图最小高度
          barMinHeight: 0,
          barGap: 0,
          label: {
            normal: {
              show: true,
              align: "center",
              verticalAlign: "top",
              position: "bottom",
              distance: 0,
              formatter: function (params) {
                return Math.abs(params.value);
              }
            }
          },
          data: series_data2
        }
      ]
    };
    var myEcharts = echarts.init(document.querySelector(".section_2_lin #classCriticalRankEcharts"));
    myEcharts.clear();
    myEcharts.setOption(option);
  }
  // 按分数统计
  function initClassCriticalScoreEcharts() {
    var legend_data = [">10分", "≤10分"];
    var xAxis_data = ["全部班级", "九年级一班", "九年级二班"];
    var series_data1 = [7, 4, 3];
    var series_data2 = [-4, -2, -2];
    var option = {
      title: {
        text: "人",
        x: "left",
        y: "top",
        textStyle: {
          color: "#5F6E82",
          fontSize: 12,
          fontWeight: 500
        }
      },
      color: ["#5C99FF", "#F39A2C"],
      legend: {
        itemWidth: 6,
        itemHeight: 6,
        bottom: 30,
        data: legend_data
      },
      grid: {
        top: 30,
        left: 5,
        right: 0,
        bottom: 65,
        containLabel: true
      },
      xAxis: [
        {
          type: "category",
          offset: 10,
          position: "bottom",
          data: xAxis_data,
          axisLabel: {
            color: "#5F6E82" //更改坐标轴文字颜色
          },
          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: legend_data[0],
          type: "bar",
          stack: "one",
          barWidth: 32,
          // 柱状图最小高度
          barMinHeight: 0,
          barGap: 0,
          label: {
            normal: {
              show: true,
              align: "center",
              verticalAlign: "bottom",
              position: "top",
              distance: 0
            }
          },
          data: series_data1
        },
        {
          name: legend_data[1],
          type: "bar",
          stack: "one",
          barWidth: 32,
          // 柱状图最小高度
          barMinHeight: 0,
          barGap: 0,
          label: {
            normal: {
              show: true,
              align: "center",
              verticalAlign: "top",
              position: "bottom",
              distance: 0,
              formatter: function (params) {
                return Math.abs(params.value);
              }
            }
          },
          data: series_data2
        }
      ]
    };
    var myEcharts = echarts.init(document.querySelector(".section_2_lin #classCriticalScoreEcharts"));
    myEcharts.clear();
    myEcharts.setOption(option);
  }
  var parameter = $(".section_2_html_root .section_2_lin_html_root").data("page-params");
  parameter = JSON.parse(parameter);
  var subjectInfo = [];
  var subjectid_ranktype = {};
  for(var sid_3 in parameter[3]) {
    if (sid_3 === "zf") {
      subjectInfo.unshift({
        subjectid: sid_3,
        subjectname: "全科"
      });
    } else {
      subjectInfo.push({
        subjectid: sid_3,
        subjectname: parameter[3][sid_3].subjectname
      });
    }
    if (!subjectid_ranktype[sid_3]) {
      subjectid_ranktype[sid_3] = {};
    }
    subjectid_ranktype[sid_3][3] = parameter[3][sid_3];
  }
  for(var sid_4 in parameter[4]) {
    if (!subjectid_ranktype[sid_4]) {
      subjectid_ranktype[sid_4] = {};
    }
    subjectid_ranktype[sid_4][4] = parameter[4][sid_4];
  }
  console.log("subjectid_ranktype", subjectid_ranktype);
  var singleRootHtml = "";
  $.each(subjectInfo, function(s_index, s_item) {
    if (s_index === 0) {
      console.log("s_index", s_index);
      console.log("s_item", s_item);




    }
  });
  $(".section_2_lin_root").html(singleRootHtml);
  initClassCriticalRankEcharts();
  initClassCriticalScoreEcharts();
});