// 专任教师职称情况 $(function () { // 标题增加年份 $('#title_text').prepend(config_now_year) // 渲染年份列表 在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', "fulltimeTeachersTitle.html?year=" + $(this).text()); let on_year = $(this).text(); echartSizeInfo(on_year); }); // var data = [ // {name: '南关区', info1: '10%', info2: '5%', info3: '2%', info4: '12%', info5: '4%', info6: '12%'}, // {name: '宽城区', info1: '6%', info2: '1%', info3: '2%', info4: '7%', info5: '4%', info6: '12%'}, // {name: '朝阳区', info1: '12%', info2: '5%', info3: '6%', info4: '8%', info5: '12%', info6: '12%'}, // {name: '二道区', info1: '3%', info2: '7%', info3: '3%', info4: '19%', info5: '8%', info6: '12%'}, // {name: '绿园区', info1: '6%', info2: '9%', info3: '2%', info4: '15%', info5: '4%', info6: '12%'}, // {name: '双阳区', info1: '10%', info2: '3%', info3: '7%', info4: '11%', info5: '4%', info6: '12%'}, // {name: '九台区', info1: '7%', info2: '15%', info3: '3%', info4: '5%', info5: '6%', info6: '12%'}, // {name: '农安县', info1: '12%', info2: '15%', info3: '2%', info4: '12%', info5: '4%', info6: '12%'}, // {name: '经开区', info1: '2%', info2: '15%', info3: '12%', info4: '12%', info5: '2%', info6: '12%'}, // {name: '净月区', info1: '18%', info2: '2%', info3: '2%', info4: '12%', info5: '4%', info6: '12%'}, // {name: '高新区', info1: '12%', info2: '5%', info3: '2%', info4: '14%', info5: '12%', info6: '12%'}, // {name: '汽车区', info1: '12%', info2: '5%', info3: '2%', info4: '12%', info5: '4%', info6: '12%'}, // {name: '榆树市', info1: '10%', info2: '5%', info3: '2%', info4: '12%', info5: '4%', info6: '12%'}, // {name: '德惠市', info1: '10%', info2: '5%', info3: '2%', info4: '12%', info5: '4%', info6: '12%'}, // ] var tableDate = []; var typeOfBe = '小学'; $('#Sxiaoxue').click(function (event) { $(this).addClass('active'); $(this).siblings().removeClass('active'); typeOfBe = '小学'; tableDate = []; echartSizeInfo(config_now_year); }) $('#Schuzhong').click(function (event) { $(this).addClass('active'); $(this).siblings().removeClass('active'); typeOfBe = '初中'; tableDate = []; echartSizeInfo(config_now_year); }) $('#Sgaozhong').click(function (event) { $(this).addClass('active'); $(this).siblings().removeClass('active'); typeOfBe = '高中'; tableDate = []; echartSizeInfo(config_now_year); }) echartSizeInfo(config_now_year); function echartSizeInfo(year) { $.post(config_serverIp + "dataex/report/QuerySimpleGP", JSON.stringify({ "access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab", "query": { "query_id": "A031", "query_param": [ year ] }, "query_cache": 0, "query_count": [ "total" ], "query_format": "json", "query_group": [ "gatherregionc" ] }), function (resport) { var data = resport.result; var indata = JSON.parse(data); var nameData = []; var info1 = []; var info2 = []; var info3 = []; var info4 = []; var info5 = []; var info6 = []; console.log(indata) indata.forEach((item, index) => { if (item.stage === typeOfBe) { if (item.didgroup === "正高级") { nameData.push(item.gatherregionc); if (item.teacherno == 0) { info1.push(0); } else { info1.push(Math.round(((item.total / item.teacherno).toFixed(4)) * 100)); } } if (item.didgroup === "副高级") { if (item.teacherno == 0) { info2.push(0); } else { info2.push(Math.round(((item.total / item.teacherno).toFixed(4)) * 100)); } } if (item.didgroup === "中级") { if (item.teacherno == 0) { info3.push(0); } else { info3.push(Math.round(((item.total / item.teacherno).toFixed(4)) * 100)); } } if (item.didgroup === "助理级") { if (item.teacherno == 0) { info4.push(0); } else { info4.push(Math.round(((item.total / item.teacherno).toFixed(4)) * 100)); } } if (item.didgroup === "员级") { if (item.teacherno == 0) { info5.push(0); } else { info5.push(Math.round(((item.total / item.teacherno).toFixed(4)) * 100)); } } if (item.didgroup === "未定职级") { if (item.teacherno == 0) { info6.push(0); } else { info6.push(Math.round(((item.total / item.teacherno).toFixed(4)) * 100)); } } } }); nameData.forEach((item, index) => { tableDate.push({ name: item, info1: `${info1[index]}%`, info2: `${info2[index]}%`, info3: `${info3[index]}%`, info4: `${info4[index]}%`, info5: `${info5[index]}%`, info6: `${info6[index]}%`, }) }); // 基于准备好的dom,初始化echarts实例 var myChart = echarts.init(document.getElementById('echartTeacherTitle')); // 专任教师职称情况柱状图 option = { // backgroundColor: '#00265f', tooltip: { trigger: 'axis', axisPointer: { type: 'shadow' } }, legend: { data: ['正高级', '副高级', '中级', '助理级', '员级', '未定级'], textStyle: { color: '#fff' } }, grid: { left: '0%', top: '8%', right: '0%', bottom: '4%', containLabel: true }, xAxis: [{ type: 'category', data: nameData, 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)", } } }], series: [ { name: '正高级', stack: '职称', type: 'bar', data: info1, barWidth: '25%', //柱子宽度 // barGap: 1, //柱子之间间距 label: { show: true, position: 'top' }, itemStyle: { normal: { color: '#00BBFF', opacity: 1, } } }, { name: '副高级', stack: '职称', type: 'bar', data: info2, barWidth: '25%', //柱子宽度 // barGap: 1, //柱子之间间距 label: { show: true, position: 'top' }, itemStyle: { normal: { color: '#ffaa33', opacity: 1, } } }, { name: '中级', stack: '职称', type: 'bar', data: info3, barWidth: '25%', //柱子宽度 // barGap: 1, //柱子之间间距 label: { show: true, position: 'top' }, itemStyle: { normal: { color: '#dddddd', opacity: 1, } } }, { name: '助理级', stack: '职称', type: 'bar', data: info4, barWidth: '25%', //柱子宽度 // barGap: 1, //柱子之间间距 label: { show: true, position: 'top' }, itemStyle: { normal: { color: '#ffff00', opacity: 1, } } }, { name: '员级', stack: '职称', type: 'bar', data: info5, barWidth: '25%', //柱子宽度 // barGap: 1, //柱子之间间距 label: { show: true, position: 'top' }, itemStyle: { normal: { color: '#5555ff', opacity: 1, } } }, { name: '未定级', stack: '职称', type: 'bar', data: info6, barWidth: '25%', //柱子宽度 // barGap: 1, //柱子之间间距 label: { show: true, position: 'top' }, itemStyle: { normal: { color: '#c71585', opacity: 1, } } }, ] }; // 使用刚指定的配置项和数据显示图表。 myChart.setOption(option); window.addEventListener("resize", function () { myChart.resize(); }); getTable(); }, 'json') } function getTable() { $('#teacherTitleTable').empty(); $('#teacherTitleTable').append( '序号县域名称正高级副高级中级助理级员级未定级' ) tableDate.forEach((item, index) => { var newIndex = index + 1; $('#teacherTitleTable').append( "" + newIndex + "" + item.name + "" + item.info1 + "" + item.info2 + "" + item.info3 + "" + item.info4 + "" + item.info5 + "" + item.info6 + "" ) }) } })