var school_name = GetQueryString('school_name') var school_id = GetQueryString('school_id') var area_name = GetQueryString('area_name') var schoolID = GetQueryString('school_id') $(function () { // 渲染年份列表 在nav.js中获取select_year $('#select-year').append(select_year) $('.select').on('click', '.placeholder', function (e) { var parent = $(this).closest('.select'); if (!parent.hasClass('is-open')) { parent.addClass('is-open'); $('.select.is-open').not(parent).removeClass('is-open'); } else { parent.removeClass('is-open'); } e.stopPropagation(); }).on('click', 'ul>li', function () { var parent = $(this).closest('.select'); parent.removeClass('is-open').find('.placeholder').text($(this).text()); $(window).attr('location', "schoolStudentSituation.html?year=" + $(this).text() + "&area_name=" + area_name + "&school_id=" + schoolID + "&school_name=" + school_name); let on_year = $(this).text(); echartSizeInfo(on_year); }); let schoolName = document.querySelector("h1"); var url = decodeURI(window.location.href); var schoolIndex = url.split("&school_name="); schoolName.innerHTML = school_name + "-学生情况"; (function ($) { $.getUrlParam = function (name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); var r = window.location.search.substr(1).match(reg); if (r != null) return unescape(r[2]); return null; } })(jQuery); // var schoolID = $.getUrlParam('school_id'); getTabBtn(config_now_year); echarts_1(config_now_year); echarts_2(config_now_year); echarts_3(config_now_year); echarts_4(config_now_year); echarts_5(config_now_year); echarts_6(config_now_year); var typeOfBe = 'small'; function getTabBtn(year) { $.post(config_serverIp + "dataex/report/QuerySimpleGP", JSON.stringify({ "access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab", "query": { "query_id": "A076", "query_param": [ year, schoolID ] }, "query_cache": 0, "query_count": [ "teacherno" ], "query_format": "json", "query_group": [ "didgroup", "stage" ] }), function (resport) { var data = resport.result; var indata = JSON.parse(data); _html = ""; if (indata[0].schooltype === "小学") { _html += `` } else if (indata[0].schooltype === "初级中学") { _html += `` } else if (indata[0].schooltype === "九年一贯制学校") { _html += `` _html += `` } else if (indata[0].schooltype === "高级中学") { _html += `` } else if (indata[0].schooltype === "完全中学") { _html += `` _html += `` } else if (indata[0].schooltype === "十二年一贯制") { _html += `` _html += `` _html += `` } let tabBtn = document.querySelector(".tab"); tabBtn.innerHTML = _html $("body").delegate(".tabbtn", "click", function (e) { $(this).addClass("active").siblings().removeClass("active"); if (e.target.innerHTML === "小学") { typeOfBe = 'small'; } else if (e.target.innerHTML === "初中") { typeOfBe = 'middle'; } else if (e.target.innerHTML === "高中") { typeOfBe = 'height'; } echarts_1(config_now_year); echarts_2(config_now_year); echarts_3(config_now_year); echarts_4(config_now_year); echarts_5(config_now_year); echarts_6(config_now_year); }) }) } function echarts_1(year) { $.post(config_serverIp + "dataex/report/QuerySimpleGP", JSON.stringify({ "access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab", "query": { "query_id": "A074", "query_param": [ year, schoolID ] }, "query_cache": 0, "query_count": [ "total" ], "query_format": "json", "query_group": [ "didgroup", "stage" ] }), function (resport) { var data = resport.result; var indata = JSON.parse(data); var newData = []; var all_num var minority_num indata.map((item, index) => { if (item.stage === "小学" && typeOfBe === 'small') { if (item.didgroup === "少数民族") { minority_num = item.total; newData.push({ value: item.total, name: item.didgroup, }) } else { all_num = item.total; } if (all_num && minority_num) { newData.push({ value: Number(all_num) - Number(minority_num), name: "汉族", }) } } else if (item.stage === "初中" && typeOfBe === 'middle') { if (item.didgroup === "少数民族") { minority_num = item.total; newData.push({ value: item.total, name: item.didgroup, }) } else { all_num = item.total; } if (all_num && minority_num) { newData.push({ value: Number(all_num) - Number(minority_num), name: "汉族", }) } } else if (item.stage === "高中" && typeOfBe === 'height') { if (item.didgroup === "少数民族") { minority_num = item.total; newData.push({ value: item.total, name: item.didgroup, }) } else { all_num = item.total; } if (all_num && minority_num) { newData.push({ value: Number(all_num) - Number(minority_num), name: "汉族", }) } } }) // 基于准备好的dom,初始化echarts实例 var myChart = echarts.init(document.getElementById('echart1')); option = { tooltip: { trigger: 'item', formatter: "{a}
{b}: {c} ({d}%)", position: function (p) { //其中p为当前鼠标的位置 return [p[0] + 10, p[1] - 10]; } }, legend: { type: 'scroll', orient: 'vertical', right: 0, top: '30%', bottom: 20, textStyle: { color: 'rgba(255,255,255,.5)', fontSize: '12', }, }, series: [ { name: '', type: 'pie', center: ['40%', '50%'], radius: ['40%', '60%'], color: ['#168EFE', '#8882F7', '#FFA06C', '#FFDB65', '#2CD1C0', '#FF88A8'], label: { show: false }, labelLine: { show: false }, data: newData, emphasis: { itemStyle: { shadowBlur: 10, shadowOffsetX: 0, shadowColor: 'rgba(0, 0, 0, 0.5)' } } } ] }; // 使用刚指定的配置项和数据显示图表。 myChart.setOption(option); window.addEventListener("resize", function () { myChart.resize(); }); }, 'json'); } function echarts_2(year) { $.post(config_serverIp + "dataex/report/QuerySimpleGP", JSON.stringify({ "access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab", "query": { "query_id": "A073", "query_param": [ year, schoolID ] }, "query_cache": 0, "query_count": [ "total" ], "query_format": "json", "query_group": [ "didgroup", "stage" ] }), function (resport) { var data = resport.result; var newData = JSON.parse(data); var x_axis = []; var class_number = []; newData.map((data, index) => { if (data.stage === "小学" && typeOfBe === 'small') { x_axis.push(data.didgroup); class_number.push(data.total); } else if (data.stage === "初中" && typeOfBe === 'middle') { x_axis.push(data.didgroup); class_number.push(data.total); } else if (data.stage === "高中" && typeOfBe === 'height') { x_axis.push(data.didgroup); class_number.push(data.total); } }) // 基于准备好的dom,初始化echarts实例 var myChart = echarts.init(document.getElementById('echart2')); // 留守儿童情况 option = { // backgroundColor: '#00265f', tooltip: { trigger: 'axis', axisPointer: { type: 'shadow' } }, grid: { left: '0%', top: '14%', right: '0%', bottom: '4%', containLabel: true }, xAxis: [{ type: 'category', data: x_axis, axisLine: { show: true, lineStyle: { color: "rgba(255,255,255,.1)", width: 1, type: "solid" }, }, axisTick: { show: false, }, axisLabel: { interval: 0, // rotate:50, show: true, splitNumber: 15, textStyle: { color: "rgba(255,255,255,.6)", fontSize: '12', }, }, }], yAxis: [{ type: 'value', axisLabel: { //formatter: '{value} %' show: true, textStyle: { color: "rgba(255,255,255,.6)", fontSize: '12', }, }, axisTick: { show: false, }, axisLine: { show: true, lineStyle: { color: "rgba(255,255,255,.1 )", width: 1, type: "solid" }, }, splitLine: { lineStyle: { color: "rgba(255,255,255,.1)", type: 'dashed' } } }], series: [ { type: 'bar', data: class_number, barWidth: '35%', //柱子宽度 // barGap: 1, //柱子之间间距 label: { show: true, position: 'top' }, itemStyle: { normal: { color: '#FFA06C', opacity: 1, barBorderRadius: 5, } } } ] }; // 使用刚指定的配置项和数据显示图表。 myChart.setOption(option); window.addEventListener("resize", function () { myChart.resize(); }); }, 'json') } function echarts_3(year) { $.post(config_serverIp + "dataex/report/QuerySimpleGP", JSON.stringify({ "access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab", "query": { "query_id": "A072", "query_param": [ year, schoolID ] }, "query_cache": 0, "query_count": [ "studentno" ], "query_format": "json", "query_group": [ "didgroup", "stage" ] }), function (resport) { var data = resport.result; if (data != "") { var newData = JSON.parse(data); var x_axis = []; var class_number = []; console.log(newData) newData.map((data, index) => { if (data.stage === "小学" && typeOfBe === 'small') { x_axis.push(data.didgroup); class_number.push(data.studentno); } else if (data.stage === "初中" && typeOfBe === 'middle') { x_axis.push(data.didgroup); class_number.push(data.studentno); } else if (data.stage === "高中" && typeOfBe === 'height') { x_axis.push(data.didgroup); class_number.push(data.studentno); } }) console.log(x_axis) } else { var x_axis = []; var class_number = []; } // 基于准备好的dom,初始化echarts实例 var myChart = echarts.init(document.getElementById('echart3')); option = { noDataLoadingOption: { text: '暂无数据', effect: 'bubble', effectOption: { effect: { n: 0 } } }, // backgroundColor: '#00265f', tooltip: { trigger: 'axis', axisPointer: { type: 'shadow' } }, grid: { left: '0%', top: '14%', right: '0%', bottom: '4%', containLabel: true }, xAxis: [{ type: 'category', data: x_axis, axisLine: { show: true, lineStyle: { color: "rgba(255,255,255,.1)", width: 1, type: "solid" }, }, axisTick: { show: false, }, axisLabel: { interval: 0, // rotate:50, show: true, splitNumber: 15, textStyle: { color: "rgba(255,255,255,.6)", fontSize: '12', }, }, }], yAxis: [{ type: 'value', axisLabel: { //formatter: '{value} %' show: true, textStyle: { color: "rgba(255,255,255,.6)", fontSize: '12', }, }, axisTick: { show: false, }, axisLine: { show: true, lineStyle: { color: "rgba(255,255,255,.1 )", width: 1, type: "solid" }, }, splitLine: { lineStyle: { color: "rgba(255,255,255,.1)", type: 'dashed' } } }], series: [ { type: 'bar', data: class_number, barWidth: '35%', //柱子宽度 // barGap: 1, //柱子之间间距 label: { show: true, position: 'top' }, itemStyle: { normal: { color: '#FFA06C', opacity: 1, barBorderRadius: 5, } } } ] }; // 使用刚指定的配置项和数据显示图表。 myChart.setOption(option); window.addEventListener("resize", function () { myChart.resize(); }); }, 'json') } function echarts_4(year) { $.post(config_serverIp + "dataex/report/QuerySimpleGP", JSON.stringify({ "access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab", "query": { "query_id": "A072", "query_param": [ year, schoolID ] }, "query_cache": 0, "query_count": [ "classno" ], "query_format": "json", "query_group": [ "didgroup", "stage" ] }), function (resport) { var data = resport.result; var newData = JSON.parse(data); var x_axis = []; var class_number = []; newData.map((data, index) => { if (data.stage === "小学" && typeOfBe === 'small') { x_axis.push(data.didgroup); class_number.push((Number(data.studentno) / Number(data.classno)).toFixed(1)); } else if (data.stage === "初中" && typeOfBe === 'middle') { x_axis.push(data.didgroup); class_number.push((Number(data.studentno) / Number(data.classno)).toFixed(1)); } else if (data.stage === "高中" && typeOfBe === 'height') { x_axis.push(data.didgroup); class_number.push((Number(data.studentno) / Number(data.classno)).toFixed(1)); } }) // 基于准备好的dom,初始化echarts实例 var myChart = echarts.init(document.getElementById('echart4')); // 留守儿童情况 option = { // backgroundColor: '#00265f', tooltip: { trigger: 'axis', axisPointer: { type: 'shadow' } }, grid: { left: '0%', top: '14%', right: '0%', bottom: '4%', containLabel: true }, xAxis: [{ type: 'category', data: x_axis, axisLine: { show: true, lineStyle: { color: "rgba(255,255,255,.1)", width: 1, type: "solid" }, }, axisTick: { show: false, }, axisLabel: { interval: 0, // rotate:50, show: true, splitNumber: 15, textStyle: { color: "rgba(255,255,255,.6)", fontSize: '12', }, }, }], yAxis: [{ type: 'value', axisLabel: { //formatter: '{value} %' show: true, textStyle: { color: "rgba(255,255,255,.6)", fontSize: '12', }, }, axisTick: { show: false, }, axisLine: { show: true, lineStyle: { color: "rgba(255,255,255,.1 )", width: 1, type: "solid" }, }, splitLine: { lineStyle: { color: "rgba(255,255,255,.1)", type: 'dashed' } } }], series: [ { name: '', type: 'bar', data: class_number, barWidth: '35%', //柱子宽度 // barGap: 1, //柱子之间间距 label: { show: true, position: 'top' }, itemStyle: { normal: { color: '#FFA06C', opacity: 1, barBorderRadius: 5, } } } ] }; // 使用刚指定的配置项和数据显示图表。 myChart.setOption(option); window.addEventListener("resize", function () { myChart.resize(); }); }, 'json') } function echarts_5(year) { $.post(config_serverIp + "dataex/report/QuerySimpleGP", JSON.stringify({ "access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab", "query": { "query_id": "A071", "query_param": [ year, schoolID ] }, "query_cache": 0, "query_count": [ "teacherno" ], "query_format": "json", "query_group": [ "didgroup", "stage" ] }), function (resport) { var data = resport.result; var indata = JSON.parse(data); var newData = []; indata.map((item, index) => { if (item.stage === "小学" && typeOfBe === 'small') { newData.push({ value: item.total, name: item.didgroup, }) } else if (item.stage === "初中" && typeOfBe === 'middle') { newData.push({ value: item.total, name: item.didgroup, }) } else if (item.stage === "高中" && typeOfBe === 'height') { newData.push({ value: item.total, name: item.didgroup, }) } }) // 基于准备好的dom,初始化echarts实例 var myChart = echarts.init(document.getElementById('echart5')); option = { tooltip: { trigger: 'item', formatter: "{a}
{b}: {c} ({d}%)", position: function (p) { //其中p为当前鼠标的位置 return [p[0] + 10, p[1] - 10]; } }, legend: { type: 'scroll', orient: 'vertical', right: 0, top: '10%', bottom: 20, textStyle: { color: 'rgba(255,255,255,.5)', fontSize: '12', }, }, series: [ { name: '小学', type: 'pie', center: ['40%', '50%'], radius: ['40%', '60%'], color: ['#168EFE', '#8882F7', '#FFA06C', '#FFDB65', '#2CD1C0', '#FF88A8'], label: { show: false }, labelLine: { show: false }, data: newData, emphasis: { itemStyle: { shadowBlur: 10, shadowOffsetX: 0, shadowColor: 'rgba(0, 0, 0, 0.5)' } } } ] }; // 使用刚指定的配置项和数据显示图表。 myChart.setOption(option); window.addEventListener("resize", function () { myChart.resize(); }); }, 'json'); } function echarts_6(year) { $.post(config_serverIp + "dataex/report/QuerySimpleGP", JSON.stringify({ "access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab", "query": { "query_id": "A070", "query_param": [ year, schoolID ] }, "query_cache": 0, "query_count": [ "teacherno" ], "query_format": "json", "query_group": [ "didgroup", "stage" ] }), function (resport) { var data = resport.result; var indata = JSON.parse(data); var newData = []; var all_num var minority_num indata.map((item, index) => { if (item.stage === "小学" && typeOfBe === 'small') { if (item.didgroup === "女") { minority_num = item.total; newData.push({ value: item.total, name: item.didgroup, }) } else { all_num = item.total; } if (all_num && minority_num) { newData.push({ value: Number(all_num) - Number(minority_num), name: "男", }) } } else if (item.stage === "初中" && typeOfBe === 'middle') { if (item.didgroup === "女") { minority_num = item.total; newData.push({ value: item.total, name: item.didgroup, }) } else { all_num = item.total; } if (all_num && minority_num) { newData.push({ value: Number(all_num) - Number(minority_num), name: "男", }) } } else if (item.stage === "高中" && typeOfBe === 'height') { if (item.didgroup === "女") { minority_num = item.total; newData.push({ value: item.total, name: item.didgroup, }) } else { all_num = item.total; } if (all_num && minority_num) { newData.push({ value: Number(all_num) - Number(minority_num), name: "男", }) } } }) // 基于准备好的dom,初始化echarts实例 var myChart = echarts.init(document.getElementById('echart6')); option = { tooltip: { trigger: 'item', formatter: "{a}
{b}: {c} ({d}%)", position: function (p) { //其中p为当前鼠标的位置 return [p[0] + 10, p[1] - 10]; } }, legend: { type: 'scroll', orient: 'vertical', right: 0, top: '30%', bottom: 20, textStyle: { color: 'rgba(255,255,255,.5)', fontSize: '12', }, }, series: [ { name: '', type: 'pie', center: ['40%', '50%'], radius: ['40%', '60%'], color: ['#168EFE', '#8882F7', '#FFA06C', '#FFDB65', '#2CD1C0', '#FF88A8'], label: { show: false }, labelLine: { show: false }, data: newData, emphasis: { itemStyle: { shadowBlur: 10, shadowOffsetX: 0, shadowColor: 'rgba(0, 0, 0, 0.5)' } } } ] }; // 使用刚指定的配置项和数据显示图表。 myChart.setOption(option); window.addEventListener("resize", function () { myChart.resize(); }); }, 'json'); } })