// 长春市教育发展--近三年办学条件发展状况 $(function () { function getData(query_id, year, query_format) { return $.post(config_serverIp + "dataex/report/QuerySimpleGP", JSON.stringify({ "access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab", "query": { "query_id": query_id, "query_param": [ year ] }, "query_cache": 0, "query_count": [ "studentno", "teacherno" ], "query_format": query_format, "query_group": [ "stage", "citycountrygroup" ] })) } // 生均校舍建筑面积情况 echarts_01_sjxsmj('小学'); // 生均占地面积情况 echarts_02_sjjzmj('小学'); // 生均运动场地面积情况 echarts_03_sjydcdmj('小学'); // 生均教学教辅面积情况 echarts_04_sjjxjfdmj('小学'); // 寄宿生生均宿舍面积情况 echarts_05_jsssjssmjdmj('小学'); // 专任教师职称情况 $("#btn_xx").click(function () { // echarts_3("小学"); $(this).siblings('a').css("color", '#3690ff'); $(this).css("color", 'white'); // 生均校舍建筑面积情况 echarts_01_sjxsmj('小学'); // 生均占地面积情况 echarts_02_sjjzmj('小学'); // 生均运动场地面积情况 echarts_03_sjydcdmj('小学'); // 生均教学教辅面积情况 echarts_04_sjjxjfdmj('小学'); // 寄宿生生均宿舍面积情况 echarts_05_jsssjssmjdmj('小学'); }) $("#btn_cz").click(function () { // echarts_3("初中"); $(this).siblings('a').css("color", '#3690ff'); $(this).css("color", 'white'); // 生均校舍建筑面积情况 echarts_01_sjxsmj('初中'); // 生均占地面积情况 echarts_02_sjjzmj('初中'); // 生均运动场地面积情况 echarts_03_sjydcdmj('初中'); // 生均教学教辅面积情况 echarts_04_sjjxjfdmj('初中'); // 寄宿生生均宿舍面积情况 echarts_05_jsssjssmjdmj('初中'); }) $("#btn_gz").click(function () { // echarts_3("高中"); $(this).siblings('a').css("color", '#3690ff'); $(this).css("color", 'white'); // 生均校舍建筑面积情况 echarts_01_sjxsmj('高中'); // 生均占地面积情况 echarts_02_sjjzmj('高中'); // 生均运动场地面积情况 echarts_03_sjydcdmj('高中'); // 生均教学教辅面积情况 echarts_04_sjjxjfdmj('高中'); // 寄宿生生均宿舍面积情况 echarts_05_jsssjssmjdmj('高中'); }) // 生均校舍建筑面积情况 function echarts_01_sjxsmj(stage) { // console.log(getData(), 'test111111') var data2018 = [] $.when( getData('A022', '2019', 'json'), getData('A022', '2020', 'json'), getData('A022', '2021', 'json') ).done(function (a1, a2, a3) { // console.log(JSON.parse(a1[0].result), 'test 2018') data2018 = JSON.parse(a1[0].result) data2019 = JSON.parse(a2[0].result) data2020 = JSON.parse(a3[0].result) // console.log(JSON.parse(a2[0].result), 'test 2019') // console.log(JSON.parse(a3[0].result), 'test 2020') // console.log(data2018, 'data2018') const year = config_years const product = ['product'] year.map((e, i) => { product.push(e) }) const cq = ['城区'] const zq = ['镇区'] const xc = ['乡村'] data2018.map((e, i) => { e.stage === stage && e.citycountrygroup === "城区" ? cq.push((e.total / e.studentno).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "镇区" ? zq.push((e.total / e.studentno).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "乡村" ? xc.push((e.total / e.studentno).toFixed(2)) : "" }) data2019.map((e, i) => { e.stage === stage && e.citycountrygroup === "城区" ? cq.push((e.total / e.studentno).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "镇区" ? zq.push((e.total / e.studentno).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "乡村" ? xc.push((e.total / e.studentno).toFixed(2)) : "" }) data2020.map((e, i) => { e.stage === stage && e.citycountrygroup === "城区" ? cq.push((e.total / e.studentno).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "镇区" ? zq.push((e.total / e.studentno).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "乡村" ? xc.push((e.total / e.studentno).toFixed(2)) : "" }) const datatest = [ product, cq, zq, xc ] // 基于准备好的dom,初始化echarts实例 var myChart = echarts.init(document.getElementById('echart1')); option = { legend: { orient: 'horizontal', x: 'center', textStyle: { color: "rgba(255,255,255,.6)", }, top: 0, data: year }, label: { show: true, position: 'top', valueAnimation: true }, grid: { left: '0%', top: '5%', right: '0%', bottom: '5%', containLabel: true }, tooltip: {}, dataset: { source: datatest }, xAxis: { type: 'category', 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: { 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', barWidth: '15%', //柱子宽度 itemStyle: { normal: { color: '#168EFE', opacity: 1, barBorderRadius: 5, } } }, { type: 'bar', barWidth: '15%', //柱子宽度 itemStyle: { normal: { color: '#8882F7', opacity: 1, barBorderRadius: 5, } } }, { type: 'bar', barWidth: '15%', //柱子宽度 itemStyle: { normal: { color: '#FFA06C', opacity: 1, barBorderRadius: 5, } } } ] // Declare several bar series, each will be mapped // to a column of dataset.source by default. }; // 使用刚指定的配置项和数据显示图表。 myChart.setOption(option); window.addEventListener("resize", function () { myChart.resize(); }); }); // }, 'json') } // 专任教师数量情况(专任教师师生比) function echarts_02_sjjzmj(stage) { // console.log(getData(), 'test111111') var data2018 = [] $.when( getData('A021', '2019', 'json'), getData('A021', '2020', 'json'), getData('A021', '2021', 'json') ).done(function (a1, a2, a3) { // console.log(JSON.parse(a1[0].result), 'test 2018') data2018 = JSON.parse(a1[0].result) data2019 = JSON.parse(a2[0].result) data2020 = JSON.parse(a3[0].result) // console.log(JSON.parse(a2[0].result), 'test 2019') // console.log(JSON.parse(a3[0].result), 'test 2020') // console.log(data2018, 'data2018') const year = config_years const product = ['product'] year.map((e, i) => { product.push(e) }) const cq = ['城区'] const zq = ['镇区'] const xc = ['乡村'] data2018.map((e, i) => { e.stage === stage && e.citycountrygroup === "城区" ? cq.push((e.total / e.studentno).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "镇区" ? zq.push((e.total / e.studentno).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "乡村" ? xc.push((e.total / e.studentno).toFixed(2)) : "" }) data2019.map((e, i) => { e.stage === stage && e.citycountrygroup === "城区" ? cq.push((e.total / e.studentno).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "镇区" ? zq.push((e.total / e.studentno).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "乡村" ? xc.push((e.total / e.studentno).toFixed(2)) : "" }) data2020.map((e, i) => { e.stage === stage && e.citycountrygroup === "城区" ? cq.push((e.total / e.studentno).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "镇区" ? zq.push((e.total / e.studentno).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "乡村" ? xc.push((e.total / e.studentno).toFixed(2)) : "" }) const datatest = [ product, cq, zq, xc ] // 基于准备好的dom,初始化echarts实例 var myChart = echarts.init(document.getElementById('echart2')); option = { legend: { orient: 'horizontal', x: 'center', textStyle: { color: "rgba(255,255,255,.6)", }, top: 0, data: year }, label: { show: true, position: 'top', valueAnimation: true }, grid: { left: '0%', top: '5%', right: '0%', bottom: '5%', containLabel: true }, tooltip: {}, dataset: { source: datatest }, xAxis: { type: 'category', 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: { 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', barWidth: '15%', //柱子宽度 itemStyle: { normal: { color: '#168EFE', opacity: 1, barBorderRadius: 5, } } }, { type: 'bar', barWidth: '15%', //柱子宽度 itemStyle: { normal: { color: '#8882F7', opacity: 1, barBorderRadius: 5, } } }, { type: 'bar', barWidth: '15%', //柱子宽度 itemStyle: { normal: { color: '#FFA06C', opacity: 1, barBorderRadius: 5, } } } ] // Declare several bar series, each will be mapped // to a column of dataset.source by default. }; // 使用刚指定的配置项和数据显示图表。 myChart.setOption(option); window.addEventListener("resize", function () { myChart.resize(); }); }); // }, 'json') } function echarts_03_sjydcdmj(stage) { // console.log(getData(), 'test111111') var data2018 = [] $.when( getData('A020', '2019', 'json'), getData('A020', '2020', 'json'), getData('A020', '2021', 'json') ).done(function (a1, a2, a3) { // console.log(JSON.parse(a1[0].result), 'test 2018') data2018 = JSON.parse(a1[0].result) data2019 = JSON.parse(a2[0].result) data2020 = JSON.parse(a3[0].result) // console.log(JSON.parse(a2[0].result), 'test 2019') // console.log(JSON.parse(a3[0].result), 'test 2020') // console.log(data2018, 'data2018') const year = config_years const product = ['product'] year.map((e, i) => { product.push(e) }) const cq = ['城区'] const zq = ['镇区'] const xc = ['乡村'] data2018.map((e, i) => { e.stage === stage && e.citycountrygroup === "城区" ? cq.push((e.total / e.studentno).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "镇区" ? zq.push((e.total / e.studentno).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "乡村" ? xc.push((e.total / e.studentno).toFixed(2)) : "" }) data2019.map((e, i) => { e.stage === stage && e.citycountrygroup === "城区" ? cq.push((e.total / e.studentno).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "镇区" ? zq.push((e.total / e.studentno).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "乡村" ? xc.push((e.total / e.studentno).toFixed(2)) : "" }) data2020.map((e, i) => { e.stage === stage && e.citycountrygroup === "城区" ? cq.push((e.total / e.studentno).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "镇区" ? zq.push((e.total / e.studentno).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "乡村" ? xc.push((e.total / e.studentno).toFixed(2)) : "" }) const datatest = [ product, cq, zq, xc ] // 基于准备好的dom,初始化echarts实例 var myChart = echarts.init(document.getElementById('echart3')); option = { legend: { orient: 'horizontal', x: 'center', textStyle: { color: "rgba(255,255,255,.6)", }, top: 0, data: year }, label: { show: true, position: 'top', valueAnimation: true }, grid: { left: '0%', top: '5%', right: '0%', bottom: '5%', containLabel: true }, tooltip: {}, dataset: { source: datatest }, xAxis: { type: 'category', 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: { 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', barWidth: '15%', //柱子宽度 itemStyle: { normal: { color: '#168EFE', opacity: 1, barBorderRadius: 5, } } }, { type: 'bar', barWidth: '15%', //柱子宽度 itemStyle: { normal: { color: '#8882F7', opacity: 1, barBorderRadius: 5, } } }, { type: 'bar', barWidth: '15%', //柱子宽度 itemStyle: { normal: { color: '#FFA06C', opacity: 1, barBorderRadius: 5, } } } ] // Declare several bar series, each will be mapped // to a column of dataset.source by default. }; // 使用刚指定的配置项和数据显示图表。 myChart.setOption(option); window.addEventListener("resize", function () { myChart.resize(); }); }); // }, 'json') } function echarts_04_sjjxjfdmj(stage) { // console.log(getData(), 'test111111') var data2018 = [] $.when( getData('A019', '2019', 'json'), getData('A019', '2020', 'json'), getData('A019', '2021', 'json') ).done(function (a1, a2, a3) { // console.log(JSON.parse(a1[0].result), 'test 2018') data2018 = JSON.parse(a1[0].result) data2019 = JSON.parse(a2[0].result) data2020 = JSON.parse(a3[0].result) // console.log(JSON.parse(a2[0].result), 'test 2019') // console.log(JSON.parse(a3[0].result), 'test 2020') // console.log(data2018, 'data2018') const year = config_years const product = ['product'] year.map((e, i) => { product.push(e) }) const cq = ['城区'] const zq = ['镇区'] const xc = ['乡村'] data2018.map((e, i) => { e.stage === stage && e.citycountrygroup === "城区" ? cq.push((e.total / e.studentno).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "镇区" ? zq.push((e.total / e.studentno).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "乡村" ? xc.push((e.total / e.studentno).toFixed(2)) : "" }) data2019.map((e, i) => { e.stage === stage && e.citycountrygroup === "城区" ? cq.push((e.total / e.studentno).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "镇区" ? zq.push((e.total / e.studentno).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "乡村" ? xc.push((e.total / e.studentno).toFixed(2)) : "" }) data2020.map((e, i) => { e.stage === stage && e.citycountrygroup === "城区" ? cq.push((e.total / e.studentno).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "镇区" ? zq.push((e.total / e.studentno).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "乡村" ? xc.push((e.total / e.studentno).toFixed(2)) : "" }) const datatest = [ product, cq, zq, xc ] // 基于准备好的dom,初始化echarts实例 var myChart = echarts.init(document.getElementById('echart4')); option = { legend: { orient: 'horizontal', x: 'center', textStyle: { color: "rgba(255,255,255,.6)", }, top: 0, data: year }, label: { show: true, position: 'top', valueAnimation: true }, grid: { left: '0%', top: '5%', right: '0%', bottom: '5%', containLabel: true }, tooltip: {}, dataset: { source: datatest }, xAxis: { type: 'category', 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: { 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', barWidth: '15%', //柱子宽度 itemStyle: { normal: { color: '#168EFE', opacity: 1, barBorderRadius: 5, } } }, { type: 'bar', barWidth: '15%', //柱子宽度 itemStyle: { normal: { color: '#8882F7', opacity: 1, barBorderRadius: 5, } } }, { type: 'bar', barWidth: '15%', //柱子宽度 itemStyle: { normal: { color: '#FFA06C', opacity: 1, barBorderRadius: 5, } } } ] // Declare several bar series, each will be mapped // to a column of dataset.source by default. }; // 使用刚指定的配置项和数据显示图表。 myChart.setOption(option); window.addEventListener("resize", function () { myChart.resize(); }); }); // }, 'json') } function echarts_05_jsssjssmjdmj(stage) { // console.log(getData(), 'test111111') var data2018 = [] $.when( getData('A018', '2019', 'json'), getData('A018', '2020', 'json'), getData('A018', '2021', 'json') ).done(function (a1, a2, a3) { console.log(JSON.parse(a1[0].result), 'test 2018') data2018 = JSON.parse(a1[0].result) data2019 = JSON.parse(a2[0].result) data2020 = JSON.parse(a3[0].result) // console.log(JSON.parse(a2[0].result), 'test 2019') // console.log(JSON.parse(a3[0].result), 'test 2020') // console.log(data2018, 'data2018') const year = config_years const product = ['product'] year.map((e, i) => { product.push(e) }) const cq = ['城区'] const zq = ['镇区'] const xc = ['乡村'] data2018.map((e, i) => { e.stage === stage && e.citycountrygroup === "城区" ? cq.push((e.jisuno / e.xueshengsushe).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "镇区" ? zq.push((e.jisuno / e.xueshengsushe).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "乡村" ? xc.push((e.jisuno / e.xueshengsushe).toFixed(2)) : "" }) data2019.map((e, i) => { e.stage === stage && e.citycountrygroup === "城区" ? cq.push((e.jisuno / e.xueshengsushe).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "镇区" ? zq.push((e.jisuno / e.xueshengsushe).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "乡村" ? xc.push((e.jisuno / e.xueshengsushe).toFixed(2)) : "" }) data2020.map((e, i) => { e.stage === stage && e.citycountrygroup === "城区" ? cq.push((e.jisuno / e.xueshengsushe).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "镇区" ? zq.push((e.jisuno / e.xueshengsushe).toFixed(2)) : "" e.stage === stage && e.citycountrygroup === "乡村" ? xc.push((e.jisuno / e.xueshengsushe).toFixed(2)) : "" }) const datatest = [ product, cq, zq, xc ] // 基于准备好的dom,初始化echarts实例 var myChart = echarts.init(document.getElementById('echart5')); option = { legend: { orient: 'horizontal', x: 'center', textStyle: { color: "rgba(255,255,255,.6)", }, top: 0, data: year }, label: { show: true, position: 'top', valueAnimation: true }, grid: { left: '0%', top: '5%', right: '0%', bottom: '5%', containLabel: true }, tooltip: {}, dataset: { source: datatest }, xAxis: { type: 'category', 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: { 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', barWidth: '15%', //柱子宽度 itemStyle: { normal: { color: '#168EFE', opacity: 1, barBorderRadius: 5, } } }, { type: 'bar', barWidth: '15%', //柱子宽度 itemStyle: { normal: { color: '#8882F7', opacity: 1, barBorderRadius: 5, } } }, { type: 'bar', barWidth: '15%', //柱子宽度 itemStyle: { normal: { color: '#FFA06C', opacity: 1, barBorderRadius: 5, } } } ] // Declare several bar series, each will be mapped // to a column of dataset.source by default. }; // 使用刚指定的配置项和数据显示图表。 myChart.setOption(option); window.addEventListener("resize", function () { myChart.resize(); }); }); // }, 'json') } })