优势学科

js/section_1.js

@@ -773,7 +773,7 @@ $(function () {
     var arr = JSON.parse(JSON.stringify(list));
     var tableobj = {};
     var tablehtml = "";
-   $.each(xAxis_data, function (idx, item) {
+    $.each(xAxis_data, function (idx, item) {
       var classs = $.grep(arr, function (val) {
         return val.subjectname == item;
       });
@@ -910,158 +910,205 @@ $(function () {
     );
     myEcharts.clear();
     myEcharts.setOption(option);
-    showscoredistributiondata(list,xAxis_data,dataArr);
+    showscoredistributiondata(list, xAxis_data, dataArr);
   }
 
-  function showscoredistributiondata(list,xAxis_data) {
+  function showscoredistributiondata(list, xAxis_data) {
     var tableobj = {};
-    var num = -1, rownum = 6;//一行六条数据
-    $.each(xAxis_data,function (idx,item) {
+    var num = -1,
+      rownum = 6; //一行六条数据
+    $.each(xAxis_data, function (idx, item) {
       var obj = $.grep(list, function (val) {
         return val.rankname == item && val.subjectid == "zf";
-      })[0]
-       if ((idx + rownum) % rownum == 0) {
+      })[0];
+      if ((idx + rownum) % rownum == 0) {
         num++;
-        tableobj[num + "goodTableHeadTr1Html"] = '<th rowspan="2">班级</th>';
-         tableobj[num + "goodTableHeadTr2Html"] = "";
-          tableobj[num+"trHtml"] = '<td><div class="my_cell">全科</div></td>';
-      } 
-      tableobj[num + "goodTableHeadTr1Html"] += '<th colspan="2">' + item + "</th>";
+        tableobj[num + "goodTableHeadTr1Html"] = '<th rowspan="2">科目</th>';
+        tableobj[num + "goodTableHeadTr2Html"] = "";
+        tableobj[num + "trHtml"] = '<td><div class="my_cell">全科</div></td>';
+      }
+      tableobj[num + "goodTableHeadTr1Html"] +=
+        '<th colspan="2">' + item + "</th>";
       tableobj[num + "goodTableHeadTr2Html"] += "<th>人数</th><th>比例</th>";
-       tableobj[num+"trHtml"] +=
-          '<td><div class="my_cell">' +
-          obj.stunum +
-          '</div></td><td><div class="my_cell">' +
-          obj.sturate +
-          "%</div></td>";
-    })
-       //计算表格高度 页面高1047 剩余高度582 表头62.5  内容27.42
-    var tableheight = (27.5+62.5 +15) *(num+1);
+      tableobj[num + "trHtml"] +=
+        '<td><div class="my_cell">' +
+        obj.stunum +
+        '</div></td><td><div class="my_cell">' +
+        obj.sturate +
+        "%</div></td>";
+    });
+    //计算表格高度 页面高1047 剩余高度582 表头62.5  内容27.42
+    var tableheight = (27.5 + 62.5 + 15) * (num + 1);
     var page = {
-      1:"",2:"",3:""
+      1: "",
+      2: "",
+      3: ""
     }; //页数
     var table = "";
     var itemheight = 27.5 + 62.5 + 15; //单表高度
     var maxheight = 0;
-    for (var i = 0; i < num + 1; i++){
-      maxheight = itemheight * (i + 1)
-      var content = '  <table border="1" class="my_table"><thead><tr class="goodTableHeadTr1">' +
-        tableobj[i + "goodTableHeadTr1Html"] + '</tr><tr class="goodTableHeadTr2">' +
-        tableobj[i + "goodTableHeadTr2Html"] + '</tr></thead><tbody class="goodTableTbody">' +
-        tableobj[i + "trHtml"] + '</tbody></table>';
+    for (var i = 0; i < num + 1; i++) {
+      maxheight = itemheight * (i + 1);
+      var content =
+        '  <table border="1" class="my_table"><thead><tr class="goodTableHeadTr1">' +
+        tableobj[i + "goodTableHeadTr1Html"] +
+        '</tr><tr class="goodTableHeadTr2">' +
+        tableobj[i + "goodTableHeadTr2Html"] +
+        '</tr></thead><tbody class="goodTableTbody">' +
+        tableobj[i + "trHtml"] +
+        "</tbody></table>";
       //计算剩余高度是否能显示最后一个表格
-      if (maxheight > 582 && 582-maxheight<itemheight) {
+      if (maxheight > 582 && 582 - maxheight < itemheight) {
         page[1] += content;
-      } else if (maxheight > 1629 && 1629-maxheight<itemheight) {
+      } else if (maxheight > 1629 && 1629 - maxheight < itemheight) {
         page[2] += content;
       } else {
         table += content;
       }
     }
-       $(".table_num0 .scoredistribution").html(table);
+    $(".table_num0 .scoredistribution").html(table);
     if (tableheight > 582) {
       //添加第一页
-      $(".table_num0").after('<div class="page_root section_2_part table_num1"></div>')
+      $(".table_num0").after(
+        '<div class="page_root section_2_part table_num1"></div>'
+      );
       $(".table_num1").html(page[1]);
     } else if (tableheight > 1629) {
       //添加第二页
-      $(".table_num1").after('<div class="page_root section_2_part table_num2"></div>')
+      $(".table_num1").after(
+        '<div class="page_root section_2_part table_num2"></div>'
+      );
       $(".table_num2").html(page[2]);
-    } 
+    }
   }
 
   function initgoodbadSubjectEcharts(list) {
     console.log(list);
     var schoolrate = [],
-        classrate = [],
-        legendlist = [list[0].classname, "全年级"];
-      this.subjectscore.forEach((item) => {
-        if (item.subjectname != "总分") {
-          classrate.push(
-            parseInt(
-              ((item.classavgscore - item.schoolavgscore) / item.bzc) * 10000
-            ) / 100 || 0
-          );
-          schoolrate.push(
-            parseInt((item.classavgscore / item.schoolavgscore) * 10000) / 100 || 0
-          );
-        }
-      });
-      // 求出数组最大值
-      let arr = [...schoolrate, ...classrate];
-      let arr1 = Math.max.apply(null, arr);
-      let maxnum = parseInt((arr1 + 10) / 10) * 10;
-      let arrList = [];
-      for (let i = 0; i < this.subjectscore.length; i++) {
-        let item = this.subjectscore[i];
-        if (item.subjectname == "总分") {
-          continue;
-        }
+      classrate = [],
+      legendlist = [ "全年级",list[0].classname];
+    console.log(legendlist);
+    $.each(list, function (idx, item) {
+      if (item.subjectname != "全科") {
+           classrate.push(
+        parseInt(
+          ((item.classavgscore - item.schoolavgscore) / item.bzc) * 10000
+        ) / 100 || 0
+      );
+      schoolrate.push(
+        parseInt((item.classavgscore / item.schoolavgscore) * 10000) / 100 || 0
+      );
+      }
+    });
+    // 求出数组最大值
+    let arr = [...schoolrate, ...classrate],yssubject = "",lssubject = "";
+    let arr1 = Math.max.apply(null, arr);
+    let maxnum = parseInt((arr1 + 10) / 10) * 10;
+    let arrList = [];
+    $.each(list, function (idx, item) {
+      if (item.subjectname != "全科") {
         let j = {
           name: item.subjectname,
           max: maxnum
         };
         arrList.push(j);
+         if (item.bzc > item.qkbzc) {
+                yssubject += item.subjectname + "、";
+              } else {
+                lssubject += item.subjectname + "、";
+              }
       }
-      var option = {
-        animation: false,
-        color: ["#5C99FF", "#FF5F56", "#5EC5C8", "#f1982b"],
-        legend: {
-          icon: "rectRound",
-          itemWidth: 6,
-          itemHeight: 6,
-          data: legendlist,
-          x: "center",
-          y: "bottom"
-        },
-        grid: {
-          //直角坐标系内绘图网格
-          left: "3%",
-          right: "3%",
-          bottom: "10%", //grid 组件离容器下侧的距离。
-          containLabel: true //grid 区域是否包含坐标轴的刻度标签。
-        },
-        radar: {
-          radius: "60%",
-          center: ["50%", "55%"],
-          indicator: arrList
+    });
+    yssubject = yssubject.substr(0, yssubject.length - 1);
+    lssubject = lssubject.substr(0, lssubject.length - 1);
+    $(".section1 .yssubject").text(yssubject); // 优势
+    $(".section1 .lssubject").text(lssubject); // 劣势
+    var option = {
+      animation: false,
+      color: ["#5C99FF", "#FF5F56", "#5EC5C8", "#f1982b"],
+      legend: {
+        icon: "rectRound",
+        itemWidth: $.UnitUtil.mm2px(2),
+        itemHeight: $.UnitUtil.mm2px(2),
+        data: legendlist,
+        x: "center",
+        y: "bottom"
+      },
+      grid: {
+        top: $.UnitUtil.mm2px(10),
+        left: 0,
+        right: 0,
+        bottom: $.UnitUtil.mm2px(8),
+        containLabel: true
+      },
+      radar: {
+        radius: "60%",
+        center: ["50%", "55%"],
+        indicator: arrList
+      },
+      series: {
+        type: "radar",
+        tooltip: {
+          trigger: "item"
         },
-        series: {
-          type: "radar",
-          tooltip: {
-            trigger: "item"
+        // areaStyle: {},  //内部阴影
+        data: [
+         {
+            value: schoolrate,
+            label: {
+              show: true,
+              formatter: function (params) {
+                return params.value;
+              }
+            },
+            name: "全年级"
           },
-          // areaStyle: {},  //内部阴影
-          data: [
-            {
-              value: classrate,
-              label: {
-                show: true,
-                formatter: function (params) {
-                  return params.value;
-                }
-              },
-              name: this.classname
+          {
+            value: classrate,
+            label: {
+              show: true,
+              formatter: function (params) {
+                return params.value;
+              }
             },
-            {
-              value: schoolrate,
-              label: {
-                show: true,
-                formatter: function (params) {
-                  return params.value;
-                }
-              },
-              name: "全年级"
-            }
-          ]
-        }
+            name: list[0].classname
+          }
+        ]
+      }
     };
     var myEcharts = echarts.init(
       document.querySelector(".section1 #goodbadSubjectEcharts")
     );
     myEcharts.clear();
     myEcharts.setOption(option);
-    
+    showgoodbadtable(list,legendlist,schoolrate,classrate);
+  }
+
+  function showgoodbadtable (list, legendlist, schoolrate, classrate) {
+    var table = "", goodTableHeadTr1Html = '<th rowspan="2">班级</th>', goodTableHeadTr2Html = "", trHtml = "";
+    $.each(list, function (idx, item) {
+      if (item.subjectname != "全科") { 
+         goodTableHeadTr1Html += '<th colspan="2">' + item.subjectname + "</th>";
+      }
+    })
+    $.each(legendlist, function (idx, item) {
+      trHtml += '<tr><th colspan="2">' + item + "</th>";
+      if (idx == 0) {
+        $.each(schoolrate, function (idx, item) {
+        trHtml += '<th colspan="2">' + item + "%</th>";
+      })
+      } else {
+          $.each(classrate, function (idx, item) {
+        trHtml += '<th colspan="2">' + item + "%</th>";
+      })
+      }
+       
+    })
+    table = '<table border="1" class="my_table"><thead><tr class="goodTableHeadTr1">' +
+        goodTableHeadTr1Html + '</tr></thead><tbody class="goodTableTbody">' +
+      trHtml + '</tbody></table>'
+    $(".section1 .goodbadtable").html(table); 
+    console.log(table);
   }
   var parameter = JSON.parse($(".section_1_html_root").data("page-params"));
   var xAxis_data = [],

sections/section_1.html

@@ -165,16 +165,18 @@
         <div>上图统计结果表示：</div>
         <div class="echarts_result_content">
           <span class="yj" style="background-color: #5c99ff"></span
-          >优势学科：<span class="goodsubject"></span>
+          >优势学科：<span class="yssubject"></span>
         </div>
         <div
           class="echarts_result_content"
           style="margin-top: 0; padding-top: 0"
         >
           <span class="yj" style="background-color: #ff5f56"></span
-          >劣势学科<span class="badsubject"></span>
+          >劣势学科<span class="lssubject"></span>
         </div>
       </div>
+      <h3 class="section_title_3">5.2 各科优劣比例分布</h3>
+      <div class="goodbadtable"></div>
     </div>
     <script src="../js/section_1.js"></script>
   </body>