$(function () { //各班等级分析 function initclassLevelEcharts(s_index, list) { var xAxis_data = [], series_data = [], legend_data = [], levelRateObj = {}, levelNumObj = {}, levelrangeObj = []; $.each(list, function (key, item) { if ($.inArray(item.classname, xAxis_data) == -1) { xAxis_data.push(item.classname) } if ($.inArray(item.rankname + "类", legend_data) == -1) { legend_data.push(item.rankname + "类") } if ($.inArray(item.rankrange, levelrangeObj) == -1) { levelrangeObj.push(item.rankrange) } if (!levelRateObj[item.rankname + '类']) { levelRateObj[item.rankname + '类'] = []; } levelRateObj[item.rankname + '类'].push(item.sturate); if (!levelNumObj[item.rankname + '类']) { levelNumObj[item.rankname + '类'] = []; } levelNumObj[item.rankname + '类'].push( item.stunum ); }); $.each(legend_data, function (key, item) { series_data.push({ name: item, type: "bar", stack: "总量", barWidth: 32, // 柱状图最小高度 barMinHeight: 16, showBackground: true, // 柱状图显示背景 backgroundStyle: { color: "#F3F4F5" }, itemStyle: { normal: { barBorderRadius: [4, 4, 4, 4] } }, label: { normal: { show: true, align: "center", verticalAlign: "middle", position: "inside", distance: 0, color: "#fff", formatter: function (params) { return levelNumObj[params.seriesName][params.dataIndex] || 0; } } }, data: levelNumObj[item] }); }); showgraphicaldata(xAxis_data, legend_data, levelrangeObj, s_index, list); var option = { color: ["#5C99FF", "#ff5f56", "#5EC5C8", "#f1982b", "#6e5eff"], animation: false, title: { text: "%", x: "left", y: "top", textStyle: { color: "#5F6E82", fontSize: $.UnitUtil.mm2px(3), fontWeight: 500, }, }, legend: { 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", 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: series_data }; 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) { //图表数据 var arr = JSON.parse(JSON.stringify(list)); var goodTableHeadTr1Html = '班级'; var goodTableHeadTr2Html = ''; var goodTableTbodyHtml = ""; $.each(legend_data, function (idx, item) { goodTableHeadTr1Html += '' + item + levelrangeObj[idx] + ''; goodTableHeadTr2Html += '人数比例'; }); $.each(xAxis_data, function (idx, item) { var trHtml = '
' + item + '
' 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; })[0]; trHtml += '
' + rank.stunum + '
' + rank.sturate + '%
' }); goodTableTbodyHtml += '' + trHtml + ''; }); $(".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) { if (!totalObj[listItem.rankname]) { totalObj[listItem.rankname] = {}; } if (!maxObj[listItem.rankname]) { maxObj[listItem.rankname] = { stunum: 0, classidArr: [] }; } if (listItem.classid === 0) { totalObj[listItem.rankname].stunum = listItem.stunum; totalObj[listItem.rankname].sturate = listItem.sturate; } else { classObj[listItem.classid] = listItem.classname; if (maxObj[listItem.rankname].stunum < listItem.stunum) { maxObj[listItem.rankname].stunum = listItem.stunum; 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) { if (!minObj[listItem.rankname]) { minObj[listItem.rankname] = { stunum: maxObj[listItem.rankname].stunum, classidArr: [] }; } if (listItem.classid !== 0) { if (minObj[listItem.rankname].stunum > listItem.stunum) { minObj[listItem.rankname].stunum = listItem.stunum; 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 + " .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 + " .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('、')); } var parameter = $(".section_2_html_root .section_2_level_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 }); } else { subjectInfo.push({ subjectid: sid, subjectname: parameter[sid].subjectname, ranks: parameter[sid].ranks }); } } var singleRootHtml = ""; $.each(subjectInfo, function (s_index, s_item) { singleRootHtml += '
' + (s_index === 0 ? '

2.分数等级对比

' : '') + '

2.' + (s_index + 1) + ' ' + s_item.subjectname + '等级对比

2.' + (s_index + 1) + '.1 各班等级分析

2.' + (s_index + 1) + '.2 各班等级比例分布

上图各等级上线统计结果为:
'; }); $(".section_2_level_root").html(singleRootHtml); $.each(subjectInfo, function (s_index, s_item) { initclassLevelEcharts(s_index, s_item.ranks); }); });