$(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( $( ".section_2_level.level_" + s_index + " #classLevelEcharts" )[0] ); 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); }); });