$(function () { // 按名次统计 function initClassCriticalRankEcharts(r_data_item, s_index) { var linescore = r_data_item.linescore; var legend_data = [">" + linescore + "名", "≤" + linescore + "名"]; var xAxis_data = []; var series_data1 = []; var series_data2 = []; $.each(r_data_item.ranks, function (index, r_item) { xAxis_data.push(r_item.classname); series_data1.push(r_item.dynum); series_data2.push(-r_item.xynum); }); 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.section_2_lin_" + s_index + " #classCriticalRankEcharts" ) ); myEcharts.clear(); myEcharts.setOption(option); } // 按分数统计 function initClassCriticalScoreEcharts(s_data_item, s_index) { var linescore = s_data_item.linescore; var legend_data = [">" + linescore + "分", "≤" + linescore + "分"]; var xAxis_data = []; var series_data1 = []; var series_data2 = []; $.each(s_data_item.ranks, function (index, r_item) { xAxis_data.push(r_item.classname); series_data1.push(r_item.dynum); series_data2.push(-r_item.xynum); }); 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.section_2_lin_" + s_index + " #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) { singleRootHtml += '
' + (s_index === 0 ? '

4.临界生对比

' : "") + '

4.' + (s_index + 1) + ' 临界生对比

4.' + (s_index + 1) + '.1 各班临界生对比分析

按名次统计
临界名次:浮动名次:名次区间:

4.' + (s_index + 1) + '.2 各班名次整体分析

班级人数占比
上图统计结果表示:
临界生最多的班级:
按分数统计
临界分:浮动分:分数区间:

4.' + (s_index + 1) + '.3 各班分数整体分析

班级人数占比
上图统计结果表示:
临界生最多的班级:
'; }); $(".section_2_lin_root").html(singleRootHtml); $.each(subjectInfo, function (s_index, s_item) { var r_data_item = subjectid_ranktype[s_item.subjectid][4]; // console.log("r_data_item", r_data_item); // 按名次统计 $(".section_2_lin_" + s_index + " .subjectname").text( r_data_item.subjectname ); $(".section_2_lin_" + s_index + " .lin_rank_num").text( r_data_item.linescore ); $(".section_2_lin_" + s_index + " .lin_rank_float").text( r_data_item.floatscore ); $(".section_2_lin_" + s_index + " .lin_rank_range").text( r_data_item.maxscore + " - " + r_data_item.minscore ); initClassCriticalRankEcharts(r_data_item, s_index); var lin_rank_tbody_html = ""; var linRankMaxInfo = { stunum: 0, classname: "", }; $.each(r_data_item.ranks, function (index, r_item) { if (r_item.classid !== 0 && linRankMaxInfo.stunum < r_item.stunum) { linRankMaxInfo.stunum = r_item.stunum; linRankMaxInfo.classname = r_item.classname; } lin_rank_tbody_html += '
' + r_item.classname + '
' + r_item.stunum + '
' + r_item.sturate + "%
"; }); $(".section_2_lin_" + s_index + " .lin_rank_tbody").html( lin_rank_tbody_html ); $(".section_2_lin_" + s_index + " .lin_rank_max").html( linRankMaxInfo.classname ); // 按分数统计 var s_data_item = subjectid_ranktype[s_item.subjectid][3]; // console.log("s_data_item", s_data_item); $(".section_2_lin_" + s_index + " .lin_score_num").text( s_data_item.linescore ); $(".section_2_lin_" + s_index + " .lin_score_float").text( s_data_item.floatscore ); $(".section_2_lin_" + s_index + " .lin_score_range").text( s_data_item.minscore + " - " + s_data_item.maxscore ); initClassCriticalScoreEcharts(s_data_item, s_index); var lin_score_tbody_html = ""; var linScoreMaxInfo = { stunum: 0, classname: "", }; $.each(s_data_item.ranks, function (index, r_item) { if (r_item.classid !== 0 && linScoreMaxInfo.stunum < r_item.stunum) { linScoreMaxInfo.stunum = r_item.stunum; linScoreMaxInfo.classname = r_item.classname; } lin_score_tbody_html += '
' + r_item.classname + '
' + r_item.stunum + '
' + r_item.sturate + "%
"; }); $(".section_2_lin_" + s_index + " .lin_score_tbody").html( lin_score_tbody_html ); $(".section_2_lin_" + s_index + " .lin_score_max").html( linScoreMaxInfo.classname ); }); });