分数分段对比

js/index.js

       // "cover", //封面
       // "preface", //前言
       // "section_1",
-      // "section_2",
+      "section_2",
       // "section_3",
       // "section_4",
-      "section_5",
+      // "section_5",
     ];
     $(".pdf_root").html(loadHtmlArr.map(function (htmlName) {
       return "<div class='" + htmlName + "_html_root'></div>";

js/scoreAnalysis/section_2_level.js

       levelrangeObj = [];
     $.each(list, function (key, item) {
       if ($.inArray(item.classname, xAxis_data) == -1) {
-        xAxis_data.push(item.classname)
+        xAxis_data.push(item.classname);
       }
       if ($.inArray(item.rankname + "类", legend_data) == -1) {
-        legend_data.push(item.rankname + "类")
+        legend_data.push(item.rankname + "类");
       }
       if ($.inArray(item.rankrange, levelrangeObj) == -1) {
-        levelrangeObj.push(item.rankrange)
+        levelrangeObj.push(item.rankrange);
       }
-      if (!levelRateObj[item.rankname + '类']) {
-        levelRateObj[item.rankname + '类'] = [];
+      if (!levelRateObj[item.rankname + "类"]) {
+        levelRateObj[item.rankname + "类"] = [];
       }
-      levelRateObj[item.rankname + '类'].push(item.sturate);
-      if (!levelNumObj[item.rankname + '类']) {
-        levelNumObj[item.rankname + '类'] = [];
+      levelRateObj[item.rankname + "类"].push(item.sturate);
+      if (!levelNumObj[item.rankname + "类"]) {
+        levelNumObj[item.rankname + "类"] = [];
       }
-      levelNumObj[item.rankname + '类'].push(
-        item.stunum
-      );
+      levelNumObj[item.rankname + "类"].push(item.stunum);
     });
     $.each(legend_data, function (key, item) {
       series_data.push({
         textStyle: {
           color: "#5F6E82",
           fontSize: $.UnitUtil.mm2px(3),
-          fontWeight: 500,
-        },
+          fontWeight: 500
+        }
       },
       legend: {
         itemWidth: $.UnitUtil.mm2px(2),
         itemHeight: $.UnitUtil.mm2px(2),
         top: "bottom",
-        data: legend_data,
+        data: legend_data
       },
       grid: {
         top: $.UnitUtil.mm2px(10),
         left: 0,
         right: 0,
         bottom: $.UnitUtil.mm2px(8),
-        containLabel: true,
+        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", //刻度线的颜色
+      xAxis: [
+        {
+          type: "category",
+          data: xAxis_data,
+          axisLabel: {
+            color: "#5F6E82", //更改坐标轴文字颜色
+            interval: 0
           },
-        },
-      }, ],
-      yAxis: [{
-        type: "value",
-        axisTick: {
-          show: false, //刻度
-        },
-        axisLine: {
-          show: false, //是否显示轴线
-          lineStyle: {
-            color: "#DADADA", //刻度线的颜色
+          axisTick: {
+            alignWithLabel: true
           },
-        },
-        splitLine: {
-          //网格线
-          lineStyle: {
-            type: "dotted", //设置网格线类型 dotted：虚线   solid:实线
+          boundaryGap: true,
+          triggerEvent: true,
+          axisLine: {
+            show: true, //是否显示轴线
+            lineStyle: {
+              color: "#DADADA" //刻度线的颜色
+            }
+          }
+        }
+      ],
+      yAxis: [
+        {
+          type: "value",
+          axisTick: {
+            show: false //刻度
           },
-          show: true, //隐藏或显示
-        },
-        axisLabel: {
-          color: "#5F6E82", //更改坐标轴文字颜色
-        },
-      }, ],
+          axisLine: {
+            show: false, //是否显示轴线
+            lineStyle: {
+              color: "#DADADA" //刻度线的颜色
+            }
+          },
+          splitLine: {
+            //网格线
+            lineStyle: {
+              type: "dotted" //设置网格线类型 dotted：虚线   solid:实线
+            },
+            show: true //隐藏或显示
+          },
+          axisLabel: {
+            color: "#5F6E82" //更改坐标轴文字颜色
+          }
+        }
+      ],
       series: series_data
     };
-    var myEcharts = echarts.init(document.querySelector(".section_2_level.level_" + s_index + " #classLevelEcharts"));
+    var myEcharts = echarts.init(
+      document.querySelector(
+        ".section_2_level.level_" + s_index + " #classLevelEcharts"
+      )
+    );
     myEcharts.clear();
     myEcharts.setOption(option);
   }
   //图表数据
-  function showgraphicaldata(xAxis_data, legend_data, levelrangeObj, s_index, list) {
+  function showgraphicaldata(
+    xAxis_data,
+    legend_data,
+    levelrangeObj,
+    s_index,
+    list
+  ) {
     //图表数据
     var arr = JSON.parse(JSON.stringify(list));
     var goodTableHeadTr1Html = '<th rowspan="2">班级</th>';
-    var goodTableHeadTr2Html = '';
+    var goodTableHeadTr2Html = "";
     var goodTableTbodyHtml = "";
     $.each(legend_data, function (idx, item) {
-      goodTableHeadTr1Html += '<th colspan="2">' + item + levelrangeObj[idx] + '</th>';
-      goodTableHeadTr2Html += '<th>人数</th><th>比例</th>';
+      goodTableHeadTr1Html +=
+        '<th colspan="2">' + item + levelrangeObj[idx] + "</th>";
+      goodTableHeadTr2Html += "<th>人数</th><th>比例</th>";
     });
     $.each(xAxis_data, function (idx, item) {
-      var trHtml = '<td><div class="my_cell">' + item + '</div></td>'
+      var trHtml = '<td><div class="my_cell">' + item + "</div></td>";
       var classs = $.grep(arr, function (val) {
         return val.classname == item;
       });
       $.each(legend_data, function (idx, item) {
         var rank = $.grep(classs, function (val) {
-          return val.rankname + '类' == item;
+          return val.rankname + "类" == item;
         })[0];
-        trHtml += '<td><div class="my_cell">' + rank.stunum +
-          '</div></td><td><div class="my_cell">' + rank.sturate +
-          '%</div></td>'
+        trHtml +=
+          '<td><div class="my_cell">' +
+          rank.stunum +
+          '</div></td><td><div class="my_cell">' +
+          rank.sturate +
+          "%</div></td>";
       });
-      goodTableTbodyHtml += '<tr>' + trHtml + '</tr>';
+      goodTableTbodyHtml += "<tr>" + trHtml + "</tr>";
     });
-    $(".section_2_level.level_" + s_index + " .goodTableHeadTr1").html(goodTableHeadTr1Html);
-    $(".section_2_level.level_" + s_index + " .goodTableHeadTr2").html(goodTableHeadTr2Html);
-    $(".section_2_level.level_" + s_index + " .goodTableTbody").html(goodTableTbodyHtml);
+    $(".section_2_level.level_" + s_index + " .goodTableHeadTr1").html(
+      goodTableHeadTr1Html
+    );
+    $(".section_2_level.level_" + s_index + " .goodTableHeadTr2").html(
+      goodTableHeadTr2Html
+    );
+    $(".section_2_level.level_" + s_index + " .goodTableTbody").html(
+      goodTableTbodyHtml
+    );
     var totalObj = {};
     var maxObj = {};
     var minObj = {};
     var classObj = {};
-    $.each(list, function(index, listItem) {
+    $.each(list, function (index, listItem) {
       if (!totalObj[listItem.rankname]) {
         totalObj[listItem.rankname] = {};
       }
         classObj[listItem.classid] = listItem.classname;
         if (maxObj[listItem.rankname].stunum < listItem.stunum) {
           maxObj[listItem.rankname].stunum = listItem.stunum;
-          maxObj[listItem.rankname].classidArr = [ listItem.classid ];
+          maxObj[listItem.rankname].classidArr = [listItem.classid];
         } else if (maxObj[listItem.rankname].stunum === listItem.stunum) {
           maxObj[listItem.rankname].classidArr.push(listItem.classid);
         }
       }
     });
-    $.each(list, function(index, listItem) {
+    $.each(list, function (index, listItem) {
       if (!minObj[listItem.rankname]) {
         minObj[listItem.rankname] = {
           stunum: maxObj[listItem.rankname].stunum,
       if (listItem.classid !== 0) {
         if (minObj[listItem.rankname].stunum > listItem.stunum) {
           minObj[listItem.rankname].stunum = listItem.stunum;
-          minObj[listItem.rankname].classidArr = [ listItem.classid ];
+          minObj[listItem.rankname].classidArr = [listItem.classid];
         } else if (minObj[listItem.rankname].stunum === listItem.stunum) {
           minObj[listItem.rankname].classidArr.push(listItem.classid);
         }
       }
     });
-    $(".section_2_level.level_" + s_index + " .result_collect").text("A类" + totalObj['A'].stunum + "人（" + totalObj['A'].sturate + "%），B类" + totalObj['B'].stunum + "人（" + totalObj['B'].sturate + "%），C类" + totalObj['C'].stunum + "人（" + totalObj['C'].sturate + "%），D类" + totalObj['D'].stunum + "人（" + totalObj['D'].sturate + "%），E类" + totalObj['E'].stunum + "人（" + totalObj['E'].sturate + "%）");
-    $(".section_2_level.level_" + s_index + " .A_collect").text("A类上线率最高的班级：" + $.map(maxObj['A'].classidArr, function (classid) {
-      return classObj[classid];
-    }).join('、') + "，A类上线率最低的班级：" + $.map(minObj['A'].classidArr, function (classid) {
-      return classObj[classid];
-    }).join('、'));
+    $(".section_2_level.level_" + s_index + " .result_collect").text(
+      "A类" +
+        totalObj["A"].stunum +
+        "人（" +
+        totalObj["A"].sturate +
+        "%），B类" +
+        totalObj["B"].stunum +
+        "人（" +
+        totalObj["B"].sturate +
+        "%），C类" +
+        totalObj["C"].stunum +
+        "人（" +
+        totalObj["C"].sturate +
+        "%），D类" +
+        totalObj["D"].stunum +
+        "人（" +
+        totalObj["D"].sturate +
+        "%），E类" +
+        totalObj["E"].stunum +
+        "人（" +
+        totalObj["E"].sturate +
+        "%）"
+    );
+    $(".section_2_level.level_" + s_index + " .A_collect").text(
+      "A类上线率最高的班级：" +
+        $.map(maxObj["A"].classidArr, function (classid) {
+          return classObj[classid];
+        }).join("、") +
+        "，A类上线率最低的班级：" +
+        $.map(minObj["A"].classidArr, function (classid) {
+          return classObj[classid];
+        }).join("、")
+    );
 
-    $(".section_2_level.level_" + s_index + " .B_collect").text("B类上线率最高的班级：" + $.map(maxObj['B'].classidArr, function (classid) {
-      return classObj[classid];
-    }).join('、') + "，B类上线率最低的班级：" + $.map(minObj['B'].classidArr, function (classid) {
-      return classObj[classid];
-    }).join('、'));
+    $(".section_2_level.level_" + s_index + " .B_collect").text(
+      "B类上线率最高的班级：" +
+        $.map(maxObj["B"].classidArr, function (classid) {
+          return classObj[classid];
+        }).join("、") +
+        "，B类上线率最低的班级：" +
+        $.map(minObj["B"].classidArr, function (classid) {
+          return classObj[classid];
+        }).join("、")
+    );
 
-    $(".section_2_level.level_" + s_index + " .C_collect").text("C类上线率最高的班级：" + $.map(maxObj['C'].classidArr, function (classid) {
-      return classObj[classid];
-    }).join('、') + "，C类上线率最低的班级：" + $.map(minObj['C'].classidArr, function (classid) {
-      return classObj[classid];
-    }).join('、'));
+    $(".section_2_level.level_" + s_index + " .C_collect").text(
+      "C类上线率最高的班级：" +
+        $.map(maxObj["C"].classidArr, function (classid) {
+          return classObj[classid];
+        }).join("、") +
+        "，C类上线率最低的班级：" +
+        $.map(minObj["C"].classidArr, function (classid) {
+          return classObj[classid];
+        }).join("、")
+    );
 
-    $(".section_2_level.level_" + s_index + " .D_collect").text("D类上线率最高的班级：" + $.map(maxObj['D'].classidArr, function (classid) {
-      return classObj[classid];
-    }).join('、') + "，D类上线率最低的班级：" + $.map(minObj['D'].classidArr, function (classid) {
-      return classObj[classid];
-    }).join('、'));
+    $(".section_2_level.level_" + s_index + " .D_collect").text(
+      "D类上线率最高的班级：" +
+        $.map(maxObj["D"].classidArr, function (classid) {
+          return classObj[classid];
+        }).join("、") +
+        "，D类上线率最低的班级：" +
+        $.map(minObj["D"].classidArr, function (classid) {
+          return classObj[classid];
+        }).join("、")
+    );
 
-    $(".section_2_level.level_" + s_index + " .E_collect").text("E类上线率最高的班级：" + $.map(maxObj['E'].classidArr, function (classid) {
-      return classObj[classid];
-    }).join('、') + "，E类上线率最低的班级：" + $.map(minObj['E'].classidArr, function (classid) {
-      return classObj[classid];
-    }).join('、'));
+    $(".section_2_level.level_" + s_index + " .E_collect").text(
+      "E类上线率最高的班级：" +
+        $.map(maxObj["E"].classidArr, function (classid) {
+          return classObj[classid];
+        }).join("、") +
+        "，E类上线率最低的班级：" +
+        $.map(minObj["E"].classidArr, function (classid) {
+          return classObj[classid];
+        }).join("、")
+    );
   }
-  var parameter = $(".section_2_html_root .section_2_level_html_root").data("page-params");
+  var parameter = $(".section_2_html_root .section_2_level_html_root").data(
+    "page-params"
+  );
   parameter = JSON.parse(parameter);
   // console.log(parameter);
   var subjectInfo = [];
   }
   var singleRootHtml = "";
   $.each(subjectInfo, function (s_index, s_item) {
-    singleRootHtml += '<div class="page_root section_2_level level_' + s_index + '">' + (s_index === 0 ? '<h2 class="section_title_2">2.分数等级对比</h2>' : '') + '<h3 class="section_title_3">2.' + (s_index + 1) + ' ' + s_item.subjectname + '等级对比</h3><h4 class="section_title_4">2.' + (s_index + 1) + '.1 各班等级分析</h4><div id="classLevelEcharts" style="margin: 0 4mm 4mm; height: 80mm"></div><h4 class="section_title_4">2.' + (s_index + 1) + '.2 各班等级比例分布</h4><table border="1" class="my_table"><thead><tr class="goodTableHeadTr1"></tr><tr class="goodTableHeadTr2"></tr></thead><tbody class="goodTableTbody"></tbody></table><div class="echarts_result"><div>上图各等级上线统计结果为：<span class="result_collect"></span>：</div><div class="echarts_result_content"><div><span class="bg_5699FF"></span><i class="A_collect"></i></div><div><span class="bg_FF5F56"></span><i class="B_collect"></i></div><div><span class="bg_5EC5C8"></span><i class="C_collect"></i></div><div><span class="bg_F1982B"></span><i class="D_collect"></i></div><div><span class="bg_F1982B"></span><i class="E_collect"></i></div></div></div></div>';
+    singleRootHtml +=
+      '<div class="page_root section_2_level level_' +
+      s_index +
+      '">' +
+      (s_index === 0 ? '<h2 class="section_title_2">2.分数等级对比</h2>' : "") +
+      '<h3 class="section_title_3">2.' +
+      (s_index + 1) +
+      " " +
+      s_item.subjectname +
+      '等级对比</h3><h4 class="section_title_4">2.' +
+      (s_index + 1) +
+      '.1 各班等级分析</h4><div id="classLevelEcharts" style="margin: 0 4mm 4mm; height: 80mm"></div><h4 class="section_title_4">2.' +
+      (s_index + 1) +
+      '.2 各班等级比例分布</h4><table border="1" class="my_table"><thead><tr class="goodTableHeadTr1"></tr><tr class="goodTableHeadTr2"></tr></thead><tbody class="goodTableTbody"></tbody></table><div class="echarts_result"><div>上图各等级上线统计结果为：<span class="result_collect"></span>：</div><div class="echarts_result_content"><div><span class="bg_5699FF"></span><i class="A_collect"></i></div><div><span class="bg_FF5F56"></span><i class="B_collect"></i></div><div><span class="bg_5EC5C8"></span><i class="C_collect"></i></div><div><span class="bg_F1982B"></span><i class="D_collect"></i></div><div><span class="bg_F1982B"></span><i class="E_collect"></i></div></div></div></div>';
   });
   $(".section_2_level_root").html(singleRootHtml);
   $.each(subjectInfo, function (s_index, s_item) {
     initclassLevelEcharts(s_index, s_item.ranks);
   });
-});
+});

js/scoreAnalysis/section_2_part.js

+$(function () {
+  function classscorePartEcharts (s_index, obj) {
+    var legend_data = [];
+    legend_data.push(obj.subjectname);
+    var xAxis_data = [];
+    var dataArr = [];
+    var list = $.grep(obj.ranks, function (val) {
+      return val.classid == 0;
+    });
+    $.each(list, function (index, item) {
+      xAxis_data.push(item.rankname);
+      dataArr.push(item.stunum);
+    });
+    var series_data = [
+      {
+        name: obj.subjectname,
+        type: "line",
+        symbol: "circle",
+        stack: obj.subjectname,
+        label: {
+          normal: {
+            show: true,
+            align: "center",
+            verticalAlign: "bottom",
+            position: "top",
+            distance: 0,
+            formatter: `{c}`
+          }
+        },
+        data: dataArr
+      }
+    ];
+    var option = {
+      animation: false,
+      title: {
+        text: "人",
+        x: "left",
+        y: "top",
+        textStyle: {
+          color: "#5F6E82",
+          fontSize: $.UnitUtil.mm2px(3),
+          fontWeight: 500
+        }
+      },
+      color: ["#5C99FF", "#ff5f56", "#5EC5C8", "#f1982b", "#6e5eff"],
+      legend: {
+        icon: "roundRect",
+        itemWidth: $.UnitUtil.mm2px(2),
+        itemHeight: $.UnitUtil.mm2px(2),
+        top: "bottom",
+        data: legend_data
+      },
+      grid: {
+        top: $.UnitUtil.mm2px(10),
+        left: 0,
+        right: 0,
+        bottom: $.UnitUtil.mm2px(8),
+        containLabel: true
+      },
+      xAxis: {
+        type: "category",
+        axisLabel: {
+          textStyle: {
+            color: "#5F6E82"
+          },
+          interval: 2,
+          rotate: 0
+        },
+        axisTick: {
+          show: false
+        },
+        data: xAxis_data
+      },
+      yAxis: {
+        axisLabel: {
+          textStyle: {
+            color: "#9B9B9BFF"
+          },
+          interval: 0
+        },
+        minInterval: 1,
+        axisLine: {
+          show: false
+        },
+        axisTick: {
+          show: false
+        },
+        splitLine: {
+          //网格线
+          lineStyle: {
+            type: "dotted", //设置网格线类型 dotted：虚线   solid:实线
+            color: "#DADADA"
+          },
+          show: true //隐藏或显示
+        },
+        type: "value"
+      },
+      series: series_data
+    };
+    var myEcharts = echarts.init(
+      document.querySelector(".part_" + s_index + " #classPartEcharts")
+    );
+    myEcharts.clear();
+    myEcharts.setOption(option);
+    showgraphicaldata(obj, xAxis_data, s_index);
+  }
+  function showgraphicaldata (obj, xAxis_data, s_index) {
+    //图表数据
+    var data = JSON.parse(JSON.stringify(obj));
+    var calsslist = [];
+    var goodTableHeadTr1Html = '<th rowspan="2">班级</th>';
+    var goodTableHeadTr2Html = "";
+    var goodTableTbodyHtml = "";
+    $.each(xAxis_data, function (idx, item) {
+      goodTableHeadTr1Html += '<th colspan="2">' + item + "</th>";
+      goodTableHeadTr2Html += "<th>人数</th><th>比例</th>";
+    });
+    $.each(data.ranks, function (idx, item) {
+      if ($.inArray(item.classname, calsslist) == -1) {
+        calsslist.push(item.classname);
+      }
+    })
+    $.each(calsslist, function (idx, item) {
+      var trHtml = '<td><div class="my_cell">' + item + "</div></td>";
+      var classs = $.grep(data.ranks, function (val) {
+        return val.classname == item;
+      });
+      $.each(xAxis_data, function (idx, item) {
+        var rank = $.grep(classs, function (val) {
+          return val.rankname == item;
+        })[0];
+        trHtml +=
+          '<td><div class="my_cell">' +
+          rank.stunum +
+          '</div></td><td><div class="my_cell">' +
+          rank.sturate +
+          "%</div></td>";
+      });
+      goodTableTbodyHtml += "<tr>" + trHtml + "</tr>";
+       
+    })
+    var table = '  <table border="1" class="my_table"><thead><tr class="goodTableHeadTr1">' +
+      goodTableHeadTr1Html + '</tr><tr class="goodTableHeadTr2">' +
+      goodTableHeadTr2Html + '</tr></thead><tbody class="goodTableTbody">' +
+      goodTableTbodyHtml+'</tbody></table>'
+    $(".part_"+ s_index + " .table_"+s_index+" ").html(table);
+  }
+  var parameter = $(".section_2_html_root .section_2_part_html_root").data(
+    "page-params"
+  );
+  parameter = JSON.parse(parameter);
+  console.log(parameter);
+  var subjectInfo = [];
+  for (var sid in parameter) {
+    if (sid === "zf") {
+      subjectInfo.unshift({
+        subjectid: sid,
+        subjectname: "全部年级",
+        ranks: parameter[sid].ranks,
+        maxscore: parameter[sid].maxscore
+      });
+    } else {
+      subjectInfo.push({
+        subjectid: sid,
+        subjectname: parameter[sid].subjectname,
+        ranks: parameter[sid].ranks,
+        maxscore: parameter[sid].maxscore
+      });
+    }
+  }
+  var singleRootHtml = "";
+  $.each(subjectInfo, function (s_index, s_item) {
+    singleRootHtml +=
+      '<div class="page_root section_2_part part_' +
+      s_index +
+      '">' +
+      (s_index === 0 ? '<h2 class="section_title_2">3.分数分段对比</h2>' : "") +
+      '<h3 class="section_title_3">3.' +
+      (s_index + 1) +
+      " " +
+      s_item.subjectname +
+      '分数段统计</h3><h4 class="section_title_4">3.' +
+      (s_index + 1) +
+      '.1 各分数段分析</h4><div>当前设置分数段：<span class="curscorepart">10</span>分/段</div><div id="classPartEcharts" style="margin: 0 4mm 4mm; height: 80mm"></div><h4 class="section_title_4">3.' +
+      (s_index + 1) +
+      '.2 各班等级比例分布</h4><div class="table_'+s_index+'"></div></div > ';
+    
+  });
+  $(".section_2_part_root").html(singleRootHtml);
+  $.each(subjectInfo, function (s_index, s_item) { 
+    $(".part_ " + s_index + " .curscorepart").text(s_item.maxscore);
+    classscorePartEcharts(s_index,s_item);
+  })
+});

sections/scoreAnalysis/section_2_part.html

 <!DOCTYPE html>
 <html lang="zh-cn">
-<head>
-  <meta charset="UTF-8">
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>校本PDF报告-第二章 成绩分析</title>
-</head>
-<body>
-  <div class="page_root section_2_part">
-    <h2 class="section_title_2">3.分数分段级对比</h2>
-    <h3 class="section_title_3">3.1 全科分数段统计</h3>
-    <h4 class="section_title_4">3.1.1 全年级各分数段分析</h4>
-    <div>当前设置分数段：<span>10</span>分/段</div>
-    <div id="classscoreLevelEcharts" style="margin: 0 4mm 4mm; height: 80mm"></div>
-    <h4 class="section_title_4">3.1.2 各班分数段比例分布</h4>
-    <table border="1" class="my_table">
-      <thead>
-        <tr>
-          <th rowspan="2">班级</th>
-          <th colspan="2">A类</th>
-          <th colspan="2">B类</th>
-          <th colspan="2">C类</th>
-          <th colspan="2">D类</th>
-          <th colspan="2">E类</th>
-        </tr>
-        <tr>
-          <th>人数</th>
-          <th>比例</th>
-          <th>人数</th>
-          <th>比例</th>
-          <th>人数</th>
-          <th>比例</th>
-          <th>人数</th>
-          <th>比例</th>
-          <th>人数</th>
-          <th>比例</th>
-        </tr>
-      </thead>
-      <tbody>
-        <tr>
-          <td><div class="my_cell">全部班级</div></td>
-          <td><div class="my_cell">5</div></td>
-          <td><div class="my_cell">4%</div></td>
-          <td><div class="my_cell">5</div></td>
-          <td><div class="my_cell">4%</div></td>
-          <td><div class="my_cell">5</div></td>
-          <td><div class="my_cell">4%</div></td>
-          <td><div class="my_cell">5</div></td>
-          <td><div class="my_cell">4%</div></td>
-          <td><div class="my_cell">5</div></td>
-          <td><div class="my_cell">4%</div></td>
-        </tr>
-        <tr>
-          <td><div class="my_cell">八年级一班</div></td>
-          <td><div class="my_cell">5</div></td>
-          <td><div class="my_cell">4%</div></td>
-          <td><div class="my_cell">5</div></td>
-          <td><div class="my_cell">4%</div></td>
-          <td><div class="my_cell">5</div></td>
-          <td><div class="my_cell">4%</div></td>
-          <td><div class="my_cell">5</div></td>
-          <td><div class="my_cell">4%</div></td>
-          <td><div class="my_cell">5</div></td>
-          <td><div class="my_cell">4%</div></td>
-        </tr>
-        <tr>
-          <td><div class="my_cell">八年级二班</div></td>
-          <td><div class="my_cell">5</div></td>
-          <td><div class="my_cell">4%</div></td>
-          <td><div class="my_cell">5</div></td>
-          <td><div class="my_cell">4%</div></td>
-          <td><div class="my_cell">5</div></td>
-          <td><div class="my_cell">4%</div></td>
-          <td><div class="my_cell">5</div></td>
-          <td><div class="my_cell">4%</div></td>
-          <td><div class="my_cell">5</div></td>
-          <td><div class="my_cell">4%</div></td>
-        </tr>
-        <tr>
-          <td><div class="my_cell">八年级三班</div></td>
-          <td><div class="my_cell">5</div></td>
-          <td><div class="my_cell">4%</div></td>
-          <td><div class="my_cell">5</div></td>
-          <td><div class="my_cell">4%</div></td>
-          <td><div class="my_cell">5</div></td>
-          <td><div class="my_cell">4%</div></td>
-          <td><div class="my_cell">5</div></td>
-          <td><div class="my_cell">4%</div></td>
-          <td><div class="my_cell">5</div></td>
-          <td><div class="my_cell">4%</div></td>
-        </tr>
-      </tbody>
-    </table>
-  </div>
-  <script src="../../js/scoreAnalysis/section_2_part.js"></script>
-</body>
-</html>
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>校本PDF报告-第二章 成绩分析</title>
+  </head>
+  <body>
+    <div class="section_2_part_root">
+      <!-- <div class="page_root section_2_part">
+        <h2 class="section_title_2">3.分数分段对比</h2>
+        <h3 class="section_title_3">3.1 全科分数段统计</h3>
+        <h4 class="section_title_4">3.1.1 全年级各分数段分析</h4>
+        <div>当前设置分数段：<span class="classPartEcharts">20</span>分/段</div>
+        <div
+          id="classscorePartEcharts"
+          style="margin: 0 4mm 4mm; height: 80mm"
+        ></div>
+        <h4 class="section_title_4">3.1.2 各班分数段比例分布</h4>
+        <div class="table">
+           <table border="1" class="my_table">
+           <thead>
+             <tr class="goodTableHeadTr1"></tr>
+             <tr class="goodTableHeadTr2"></tr>
+           </thead>
+           <tbody class="goodTableTbody"></tbody>
+          </table>
+        </div>
+      </div> -->
+    </div>
+    <script src="../../js/scoreAnalysis/section_2_part.js"></script>
+  </body>
+</html>