|
|
var area_name = GetQueryString('area_name')
|
|
|
$(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', "areaSchoolRunning.html?year=" + $(this).text() + "&area_name=" + area_name);
|
|
|
let on_year = $(this).text();
|
|
|
echartSizeInfo(on_year);
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
let areaName = document.querySelector("h1");
|
|
|
var url = decodeURI(window.location.href);
|
|
|
var argsIndex = url.split("?area_name=");
|
|
|
areaName.innerHTML = area_name + '--办学条件发展状况';
|
|
|
$('h1').prepend(config_now_year)
|
|
|
echarts_1(config_now_year);
|
|
|
echarts_11(config_now_year);
|
|
|
echarts_2(config_now_year);
|
|
|
echarts_22(config_now_year);
|
|
|
echarts_4(config_now_year);
|
|
|
echarts_44(config_now_year);
|
|
|
echarts_5(config_now_year);
|
|
|
echarts_55(config_now_year);
|
|
|
echarts_6(config_now_year);
|
|
|
echarts_7(config_now_year);
|
|
|
|
|
|
function echarts_1(year) {
|
|
|
$.post(config_serverIp + "dataex/report/QuerySimpleGP", JSON.stringify({
|
|
|
"access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
|
|
|
"query": {
|
|
|
"query_id": "A054",
|
|
|
"query_param": [
|
|
|
year, area_name
|
|
|
]
|
|
|
},
|
|
|
"query_cache": 0,
|
|
|
"query_count": [
|
|
|
"total", "studentno"
|
|
|
],
|
|
|
"query_format": "echarts",
|
|
|
"query_group": [
|
|
|
"stage", "citycountrygroup"
|
|
|
]
|
|
|
}), function (resport) {
|
|
|
var data = resport.result;
|
|
|
var newData = JSON.parse(data);
|
|
|
|
|
|
var smallArea = 0;
|
|
|
var smallPerson = 0;
|
|
|
var middleArea = 0;
|
|
|
var middlePerson = 0;
|
|
|
var heightArea = 0;
|
|
|
var heightPerson = 0;
|
|
|
if (newData.datas[0]) {
|
|
|
newData.datas[0].map((item, index) => {
|
|
|
smallArea = smallArea + Number(item);
|
|
|
});
|
|
|
newData.datas2[0].map((item, index) => {
|
|
|
smallPerson = smallPerson + Number(item);
|
|
|
});
|
|
|
}
|
|
|
if (newData.datas[1]) {
|
|
|
newData.datas[1].map((item, index) => {
|
|
|
middleArea = middleArea + Number(item);
|
|
|
});
|
|
|
newData.datas2[1].map((item, index) => {
|
|
|
middlePerson = middlePerson + Number(item);
|
|
|
});
|
|
|
}
|
|
|
if (newData.datas[2]) {
|
|
|
newData.datas[2].map((item, index) => {
|
|
|
heightArea = heightArea + Number(item);
|
|
|
});
|
|
|
newData.datas2[2].map((item, index) => {
|
|
|
heightPerson = heightPerson + Number(item);
|
|
|
});
|
|
|
}
|
|
|
var cityTotal = [(smallArea / smallPerson).toFixed(2), (middleArea / middlePerson).toFixed(2), (heightArea / heightPerson).toFixed(2)];
|
|
|
// 基于准备好的dom，初始化echarts实例
|
|
|
var myChart = echarts.init(document.getElementById('echart1')); // 各阶段学校数量
|
|
|
option = {
|
|
|
title: [{
|
|
|
text: '生均校舍建筑面积情况',
|
|
|
left: 'left',
|
|
|
textStyle: {
|
|
|
color: '#fff',
|
|
|
fontSize: '12',
|
|
|
marginBottom: '1rem',
|
|
|
}
|
|
|
|
|
|
}],
|
|
|
tooltip: {
|
|
|
trigger: 'axis',
|
|
|
axisPointer: {
|
|
|
type: 'cross',
|
|
|
}
|
|
|
},
|
|
|
legend: {
|
|
|
data: ['市区', '全国'],
|
|
|
textStyle: {
|
|
|
color: '#fff'
|
|
|
}
|
|
|
},
|
|
|
xAxis: [
|
|
|
{
|
|
|
type: 'category',
|
|
|
data: newData.groups[0],
|
|
|
axisPointer: {
|
|
|
type: 'shadow'
|
|
|
},
|
|
|
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,.4)",
|
|
|
type: 'dashed'
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
type: 'value',
|
|
|
axisLabel: {
|
|
|
//formatter: '{value} %'
|
|
|
show: true,
|
|
|
textStyle: {
|
|
|
color: "rgba(255,255,255,.6)",
|
|
|
fontSize: '12',
|
|
|
},
|
|
|
},
|
|
|
axisTick: {
|
|
|
show: false,
|
|
|
},
|
|
|
axisLine: {
|
|
|
show: false,
|
|
|
},
|
|
|
splitLine: {
|
|
|
lineStyle: {
|
|
|
color: "rgba(255,255,255,.1)",
|
|
|
type: 'dashed'
|
|
|
}
|
|
|
}
|
|
|
// name: '温度',
|
|
|
// min: 0,
|
|
|
// max: 25,
|
|
|
// interval: 5,
|
|
|
// axisLabel: {
|
|
|
// formatter: '{value} °C'
|
|
|
// }
|
|
|
}
|
|
|
],
|
|
|
series: [
|
|
|
{
|
|
|
name: '市区',
|
|
|
type: 'bar',
|
|
|
data: cityTotal,
|
|
|
barWidth: '35%', //柱子宽度
|
|
|
label: {
|
|
|
show: true,
|
|
|
position: 'top'
|
|
|
},
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: '#FF88A8',
|
|
|
opacity: 1,
|
|
|
barBorderRadius: 5,
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
name: '全国',
|
|
|
type: 'line',
|
|
|
yAxisIndex: 1,
|
|
|
data: [0, 0, 0],
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: '#2CD1C0',
|
|
|
opacity: 1,
|
|
|
barBorderRadius: 5,
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
]
|
|
|
};
|
|
|
|
|
|
// 使用刚指定的配置项和数据显示图表。
|
|
|
myChart.setOption(option);
|
|
|
window.addEventListener("resize", function () {
|
|
|
myChart.resize();
|
|
|
});
|
|
|
}, 'json')
|
|
|
}
|
|
|
function echarts_11(year) {
|
|
|
$.post(config_serverIp + "dataex/report/QuerySimpleGP", JSON.stringify({
|
|
|
"access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
|
|
|
"query": {
|
|
|
"query_id": "A054",
|
|
|
"query_param": [
|
|
|
year, area_name
|
|
|
]
|
|
|
},
|
|
|
"query_cache": 0,
|
|
|
"query_count": [
|
|
|
"total", "studentno"
|
|
|
],
|
|
|
"query_format": "echarts",
|
|
|
"query_group": [
|
|
|
"stage", "citycountrygroup"
|
|
|
]
|
|
|
}), function (resport) {
|
|
|
var data = resport.result;
|
|
|
var newData = JSON.parse(data);
|
|
|
var cityNum = [];// 城区
|
|
|
var townNum = [];// 镇区
|
|
|
var ruralNum = [];// 乡村
|
|
|
newData.datas[0] ? newData.datas[0].map((item, index) => {
|
|
|
cityNum.push(((item / newData.datas2[0][index])).toFixed(2));
|
|
|
}) : '';
|
|
|
newData.datas[1] ? newData.datas[1].map((item, index) => {
|
|
|
townNum.push((item / newData.datas2[1][index]).toFixed(2));
|
|
|
}) : '';
|
|
|
newData.datas[2] ? newData.datas[2].map((item, index) => {
|
|
|
ruralNum.push((item / newData.datas2[2][index]).toFixed(2));
|
|
|
}) : '';
|
|
|
// 基于准备好的dom，初始化echarts实例
|
|
|
var myChart = echarts.init(document.getElementById('echart11')); // 各阶段学校数量
|
|
|
|
|
|
option = {
|
|
|
// backgroundColor: '#00265f',
|
|
|
tooltip: {
|
|
|
trigger: 'axis',
|
|
|
axisPointer: {
|
|
|
type: 'shadow'
|
|
|
}
|
|
|
},
|
|
|
title: [{
|
|
|
text: '城乡生均校舍建筑面积情况',
|
|
|
left: 'left',
|
|
|
textStyle: {
|
|
|
color: '#fff',
|
|
|
fontSize: '12',
|
|
|
marginBottom: '1rem',
|
|
|
}
|
|
|
|
|
|
}],
|
|
|
grid: {
|
|
|
left: '0%',
|
|
|
top: '8%',
|
|
|
right: '0%',
|
|
|
bottom: '4%',
|
|
|
containLabel: true
|
|
|
},
|
|
|
legend: {
|
|
|
data: newData.groups[1],
|
|
|
textStyle: {
|
|
|
color: '#fff'
|
|
|
}
|
|
|
},
|
|
|
xAxis: [{
|
|
|
type: 'category',
|
|
|
data: newData.groups[0],
|
|
|
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: cityNum,
|
|
|
barWidth: '15%', //柱子宽度
|
|
|
// barGap: 1, //柱子之间间距
|
|
|
label: {
|
|
|
show: true,
|
|
|
position: 'top'
|
|
|
},
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: '#168EFE',
|
|
|
opacity: 1,
|
|
|
barBorderRadius: 5,
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
name: '镇区',
|
|
|
type: 'bar',
|
|
|
data: townNum,
|
|
|
barWidth: '15%', //柱子宽度
|
|
|
// barGap: 1, //柱子之间间距
|
|
|
label: {
|
|
|
show: true,
|
|
|
position: 'top'
|
|
|
},
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: '#FFDB65',
|
|
|
opacity: 1,
|
|
|
barBorderRadius: 5,
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
name: '乡村',
|
|
|
type: 'bar',
|
|
|
data: ruralNum,
|
|
|
barWidth: '15%', //柱子宽度
|
|
|
// barGap: 1, //柱子之间间距
|
|
|
label: {
|
|
|
show: true,
|
|
|
position: 'top'
|
|
|
},
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: '#2CD1C0',
|
|
|
opacity: 1,
|
|
|
barBorderRadius: 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": "A053",
|
|
|
"query_param": [
|
|
|
year, area_name
|
|
|
]
|
|
|
},
|
|
|
"query_cache": 0,
|
|
|
"query_count": [
|
|
|
"total", "studentno"
|
|
|
],
|
|
|
"query_format": "echarts",
|
|
|
"query_group": [
|
|
|
"stage", "citycountrygroup"
|
|
|
]
|
|
|
}), function (resport) {
|
|
|
var data = resport.result;
|
|
|
var newData = JSON.parse(data);
|
|
|
|
|
|
var smallArea = 0;
|
|
|
var smallPerson = 0;
|
|
|
var middleArea = 0;
|
|
|
var middlePerson = 0;
|
|
|
var heightArea = 0;
|
|
|
var heightPerson = 0;
|
|
|
if (newData.datas[0]) {
|
|
|
newData.datas[0].map((item, index) => {
|
|
|
smallArea = smallArea + Number(item);
|
|
|
});
|
|
|
newData.datas2[0].map((item, index) => {
|
|
|
smallPerson = smallPerson + Number(item);
|
|
|
});
|
|
|
}
|
|
|
if (newData.datas[1]) {
|
|
|
newData.datas[1].map((item, index) => {
|
|
|
middleArea = middleArea + Number(item);
|
|
|
});
|
|
|
newData.datas2[1].map((item, index) => {
|
|
|
middlePerson = middlePerson + Number(item);
|
|
|
});
|
|
|
}
|
|
|
if (newData.datas[2]) {
|
|
|
newData.datas[2].map((item, index) => {
|
|
|
heightArea = heightArea + Number(item);
|
|
|
});
|
|
|
newData.datas2[2].map((item, index) => {
|
|
|
heightPerson = heightPerson + Number(item);
|
|
|
});
|
|
|
}
|
|
|
var cityTotal = [(smallArea / smallPerson).toFixed(2), (middleArea / middlePerson).toFixed(2), (heightArea / heightPerson).toFixed(2)];
|
|
|
// 基于准备好的dom，初始化echarts实例
|
|
|
var myChart = echarts.init(document.getElementById('echart2')); // 学校规模情况
|
|
|
|
|
|
option = {
|
|
|
title: [{
|
|
|
text: '生均占地面积情况',
|
|
|
left: 'left',
|
|
|
textStyle: {
|
|
|
color: '#fff',
|
|
|
fontSize: '12',
|
|
|
marginBottom: '1rem',
|
|
|
}
|
|
|
|
|
|
}],
|
|
|
tooltip: {
|
|
|
trigger: 'axis',
|
|
|
axisPointer: {
|
|
|
type: 'cross',
|
|
|
crossStyle: {
|
|
|
color: 'red'
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
legend: {
|
|
|
data: ['市区', '全国'],
|
|
|
textStyle: {
|
|
|
color: '#fff'
|
|
|
}
|
|
|
},
|
|
|
xAxis: [
|
|
|
{
|
|
|
type: 'category',
|
|
|
data: newData.groups[0],
|
|
|
axisPointer: {
|
|
|
type: 'shadow'
|
|
|
},
|
|
|
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,.4)",
|
|
|
type: 'dashed'
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
type: 'value',
|
|
|
axisLabel: {
|
|
|
//formatter: '{value} %'
|
|
|
show: true,
|
|
|
textStyle: {
|
|
|
color: "rgba(255,255,255,.6)",
|
|
|
fontSize: '12',
|
|
|
},
|
|
|
},
|
|
|
axisTick: {
|
|
|
show: false,
|
|
|
},
|
|
|
axisLine: {
|
|
|
show: false,
|
|
|
},
|
|
|
splitLine: {
|
|
|
lineStyle: {
|
|
|
color: "rgba(255,255,255,.1)",
|
|
|
type: 'dashed'
|
|
|
}
|
|
|
}
|
|
|
|
|
|
// name: '温度',
|
|
|
// min: 0,
|
|
|
// max: 25,
|
|
|
// interval: 5,
|
|
|
// axisLabel: {
|
|
|
// formatter: '{value} °C'
|
|
|
// }
|
|
|
}
|
|
|
],
|
|
|
series: [
|
|
|
{
|
|
|
name: '市区',
|
|
|
type: 'bar',
|
|
|
data: cityTotal,
|
|
|
barWidth: '35%', //柱子宽度
|
|
|
label: {
|
|
|
show: true,
|
|
|
position: 'top'
|
|
|
},
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: '#8882F7',
|
|
|
opacity: 1,
|
|
|
barBorderRadius: 5,
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
name: '全国',
|
|
|
type: 'line',
|
|
|
yAxisIndex: 1,
|
|
|
data: [0, 0, 0],
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: '#2CD1C0',
|
|
|
opacity: 1,
|
|
|
barBorderRadius: 5,
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
]
|
|
|
};
|
|
|
|
|
|
// 使用刚指定的配置项和数据显示图表。
|
|
|
myChart.setOption(option);
|
|
|
window.addEventListener("resize", function () {
|
|
|
myChart.resize();
|
|
|
});
|
|
|
}, 'json')
|
|
|
}
|
|
|
function echarts_22(year) {
|
|
|
$.post(config_serverIp + "dataex/report/QuerySimpleGP", JSON.stringify({
|
|
|
"access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
|
|
|
"query": {
|
|
|
"query_id": "A053",
|
|
|
"query_param": [
|
|
|
year, area_name
|
|
|
]
|
|
|
},
|
|
|
"query_cache": 0,
|
|
|
"query_count": [
|
|
|
"total", "studentno"
|
|
|
],
|
|
|
"query_format": "echarts",
|
|
|
"query_group": [
|
|
|
"stage", "citycountrygroup"
|
|
|
]
|
|
|
}), function (resport) {
|
|
|
var data = resport.result;
|
|
|
var newData = JSON.parse(data);
|
|
|
var cityNum = [];// 城区
|
|
|
var townNum = [];// 镇区
|
|
|
var ruralNum = [];// 乡村
|
|
|
newData.datas[0] ? newData.datas[0].map((item, index) => {
|
|
|
cityNum.push(((item / newData.datas2[0][index])).toFixed(2));
|
|
|
}) : '';
|
|
|
newData.datas[1] ? newData.datas[1].map((item, index) => {
|
|
|
townNum.push((item / newData.datas2[1][index]).toFixed(2));
|
|
|
}) : '';
|
|
|
newData.datas[2] ? newData.datas[2].map((item, index) => {
|
|
|
ruralNum.push((item / newData.datas2[2][index]).toFixed(2));
|
|
|
}) : '';
|
|
|
// 基于准备好的dom，初始化echarts实例
|
|
|
var myChart = echarts.init(document.getElementById('echart22')); // 学校规模情况
|
|
|
|
|
|
option = {
|
|
|
// backgroundColor: '#00265f',
|
|
|
title: [{
|
|
|
text: '城乡生均占地面积情况',
|
|
|
left: 'left',
|
|
|
textStyle: {
|
|
|
color: '#fff',
|
|
|
fontSize: '12',
|
|
|
marginBottom: '1rem',
|
|
|
}
|
|
|
|
|
|
}],
|
|
|
tooltip: {
|
|
|
trigger: 'axis',
|
|
|
axisPointer: {
|
|
|
type: 'shadow'
|
|
|
}
|
|
|
},
|
|
|
grid: {
|
|
|
left: '0%',
|
|
|
top: '14%',
|
|
|
right: '0%',
|
|
|
bottom: '4%',
|
|
|
containLabel: true
|
|
|
},
|
|
|
legend: {
|
|
|
data: newData.groups[1],
|
|
|
textStyle: {
|
|
|
color: '#fff'
|
|
|
}
|
|
|
},
|
|
|
xAxis: [{
|
|
|
type: 'category',
|
|
|
data: newData.groups[0],
|
|
|
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: newData.groups[1][0],
|
|
|
type: 'bar',
|
|
|
data: cityNum,
|
|
|
barWidth: '15%', //柱子宽度
|
|
|
// barGap: 1, //柱子之间间距
|
|
|
label: {
|
|
|
show: true,
|
|
|
position: 'top'
|
|
|
},
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: '#168EFE',
|
|
|
opacity: 1,
|
|
|
barBorderRadius: 5,
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
name: newData.groups[1][1],
|
|
|
type: 'bar',
|
|
|
data: townNum,
|
|
|
barWidth: '15%', //柱子宽度
|
|
|
// barGap: 1, //柱子之间间距
|
|
|
label: {
|
|
|
show: true,
|
|
|
position: 'top'
|
|
|
},
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: '#FFDB65',
|
|
|
opacity: 1,
|
|
|
barBorderRadius: 5,
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
name: newData.groups[1][2],
|
|
|
type: 'bar',
|
|
|
data: ruralNum,
|
|
|
barWidth: '15%', //柱子宽度
|
|
|
// barGap: 1, //柱子之间间距
|
|
|
label: {
|
|
|
show: true,
|
|
|
position: 'top'
|
|
|
},
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: '#2CD1C0',
|
|
|
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": "A052",
|
|
|
"query_param": [
|
|
|
year, area_name
|
|
|
]
|
|
|
},
|
|
|
"query_cache": 0,
|
|
|
"query_count": [
|
|
|
"total", "studentno"
|
|
|
],
|
|
|
"query_format": "echarts",
|
|
|
"query_group": [
|
|
|
"stage", "citycountrygroup"
|
|
|
]
|
|
|
}), function (resport) {
|
|
|
var data = resport.result;
|
|
|
var newData = JSON.parse(data);
|
|
|
|
|
|
var smallArea = 0;
|
|
|
var smallPerson = 0;
|
|
|
var middleArea = 0;
|
|
|
var middlePerson = 0;
|
|
|
var heightArea = 0;
|
|
|
var heightPerson = 0;
|
|
|
if (newData.datas[0]) {
|
|
|
newData.datas[0].map((item, index) => {
|
|
|
smallArea = smallArea + Number(item);
|
|
|
});
|
|
|
newData.datas2[0].map((item, index) => {
|
|
|
smallPerson = smallPerson + Number(item);
|
|
|
});
|
|
|
}
|
|
|
if (newData.datas[1]) {
|
|
|
newData.datas[1].map((item, index) => {
|
|
|
middleArea = middleArea + Number(item);
|
|
|
});
|
|
|
newData.datas2[1].map((item, index) => {
|
|
|
middlePerson = middlePerson + Number(item);
|
|
|
});
|
|
|
}
|
|
|
if (newData.datas[2]) {
|
|
|
newData.datas[2].map((item, index) => {
|
|
|
heightArea = heightArea + Number(item);
|
|
|
});
|
|
|
newData.datas2[2].map((item, index) => {
|
|
|
heightPerson = heightPerson + Number(item);
|
|
|
});
|
|
|
}
|
|
|
|
|
|
var cityTotal = [(smallArea / smallPerson).toFixed(2), (middleArea / middlePerson).toFixed(2), (heightArea / heightPerson).toFixed(2)];
|
|
|
// 基于准备好的dom，初始化echarts实例
|
|
|
var myChart = echarts.init(document.getElementById('echart4')); // 寄宿生情况
|
|
|
option = {
|
|
|
title: [{
|
|
|
text: '生均运动场面积情况',
|
|
|
left: 'left',
|
|
|
textStyle: {
|
|
|
color: '#fff',
|
|
|
fontSize: '12',
|
|
|
marginBottom: '1rem',
|
|
|
}
|
|
|
|
|
|
}],
|
|
|
tooltip: {
|
|
|
trigger: 'axis',
|
|
|
axisPointer: {
|
|
|
type: 'cross',
|
|
|
crossStyle: {
|
|
|
color: 'red'
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
legend: {
|
|
|
data: ['市区', '全国'],
|
|
|
textStyle: {
|
|
|
color: '#fff'
|
|
|
}
|
|
|
},
|
|
|
xAxis: [
|
|
|
{
|
|
|
type: 'category',
|
|
|
data: newData.groups[0],
|
|
|
axisPointer: {
|
|
|
type: 'shadow'
|
|
|
},
|
|
|
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,.4)",
|
|
|
type: 'dashed'
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
type: 'value',
|
|
|
axisLabel: {
|
|
|
//formatter: '{value} %'
|
|
|
show: true,
|
|
|
textStyle: {
|
|
|
color: "rgba(255,255,255,.6)",
|
|
|
fontSize: '12',
|
|
|
},
|
|
|
},
|
|
|
axisTick: {
|
|
|
show: false,
|
|
|
},
|
|
|
axisLine: {
|
|
|
show: false,
|
|
|
},
|
|
|
splitLine: {
|
|
|
lineStyle: {
|
|
|
color: "rgba(255,255,255,.1)",
|
|
|
type: 'dashed'
|
|
|
}
|
|
|
}
|
|
|
|
|
|
// name: '温度',
|
|
|
// min: 0,
|
|
|
// max: 25,
|
|
|
// interval: 5,
|
|
|
// axisLabel: {
|
|
|
// formatter: '{value} °C'
|
|
|
// }
|
|
|
}
|
|
|
],
|
|
|
series: [
|
|
|
{
|
|
|
name: '市区',
|
|
|
type: 'bar',
|
|
|
data: cityTotal,
|
|
|
barWidth: '35%', //柱子宽度
|
|
|
label: {
|
|
|
show: true,
|
|
|
position: 'top'
|
|
|
},
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: '#FFA06C',
|
|
|
opacity: 1,
|
|
|
barBorderRadius: 5,
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
name: '全国',
|
|
|
type: 'line',
|
|
|
yAxisIndex: 1,
|
|
|
data: [0, 0, 0],
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: '#2CD1C0',
|
|
|
opacity: 1,
|
|
|
barBorderRadius: 5,
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
]
|
|
|
};
|
|
|
// 使用刚指定的配置项和数据显示图表。
|
|
|
myChart.setOption(option);
|
|
|
window.addEventListener("resize", function () {
|
|
|
myChart.resize();
|
|
|
});
|
|
|
}, 'json')
|
|
|
}
|
|
|
function echarts_44(year) {
|
|
|
$.post(config_serverIp + "dataex/report/QuerySimpleGP", JSON.stringify({
|
|
|
"access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
|
|
|
"query": {
|
|
|
"query_id": "A052",
|
|
|
"query_param": [
|
|
|
year, area_name
|
|
|
]
|
|
|
},
|
|
|
"query_cache": 0,
|
|
|
"query_count": [
|
|
|
"total", "studentno"
|
|
|
],
|
|
|
"query_format": "echarts",
|
|
|
"query_group": [
|
|
|
"stage", "citycountrygroup"
|
|
|
]
|
|
|
}), function (resport) {
|
|
|
var data = resport.result;
|
|
|
var newData = JSON.parse(data);
|
|
|
var cityNum = [];// 城区
|
|
|
var townNum = [];// 镇区
|
|
|
var ruralNum = [];// 乡村
|
|
|
newData.datas[0] ? newData.datas[0].map((item, index) => {
|
|
|
cityNum.push(((item / newData.datas2[0][index])).toFixed(2));
|
|
|
}) : '';
|
|
|
newData.datas[1] ? newData.datas[1].map((item, index) => {
|
|
|
townNum.push((item / newData.datas2[1][index]).toFixed(2));
|
|
|
}) : '';
|
|
|
newData.datas[2] ? newData.datas[2].map((item, index) => {
|
|
|
ruralNum.push((item / newData.datas2[2][index]).toFixed(2));
|
|
|
}) : '';
|
|
|
// debugger
|
|
|
// 基于准备好的dom，初始化echarts实例
|
|
|
var myChart = echarts.init(document.getElementById('echart44')); //
|
|
|
option = {
|
|
|
// backgroundColor: '#00265f',
|
|
|
title: [{
|
|
|
text: '城乡生均运动场面积情况',
|
|
|
left: 'left',
|
|
|
textStyle: {
|
|
|
color: '#fff',
|
|
|
fontSize: '12',
|
|
|
marginBottom: '1rem',
|
|
|
}
|
|
|
|
|
|
}],
|
|
|
tooltip: {
|
|
|
trigger: 'axis',
|
|
|
axisPointer: {
|
|
|
type: 'shadow'
|
|
|
}
|
|
|
},
|
|
|
grid: {
|
|
|
left: '0%',
|
|
|
top: '14%',
|
|
|
right: '0%',
|
|
|
bottom: '4%',
|
|
|
containLabel: true
|
|
|
},
|
|
|
legend: {
|
|
|
data: newData.groups[1],
|
|
|
textStyle: {
|
|
|
color: '#fff'
|
|
|
}
|
|
|
},
|
|
|
xAxis: [{
|
|
|
type: 'category',
|
|
|
data: newData.groups[0],
|
|
|
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: newData.groups[1][0],
|
|
|
type: 'bar',
|
|
|
data: cityNum,
|
|
|
barWidth: '15%', //柱子宽度
|
|
|
// barGap: 1, //柱子之间间距
|
|
|
label: {
|
|
|
show: true,
|
|
|
position: 'top'
|
|
|
},
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: '#168EFE',
|
|
|
opacity: 1,
|
|
|
barBorderRadius: 5,
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
name: newData.groups[1][1],
|
|
|
type: 'bar',
|
|
|
data: townNum,
|
|
|
barWidth: '15%', //柱子宽度
|
|
|
// barGap: 1, //柱子之间间距
|
|
|
label: {
|
|
|
show: true,
|
|
|
position: 'top'
|
|
|
},
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: '#FFDB65',
|
|
|
opacity: 1,
|
|
|
barBorderRadius: 5,
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
name: newData.groups[1][2],
|
|
|
type: 'bar',
|
|
|
data: ruralNum,
|
|
|
barWidth: '15%', //柱子宽度
|
|
|
// barGap: 1, //柱子之间间距
|
|
|
label: {
|
|
|
show: true,
|
|
|
position: 'top'
|
|
|
},
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: '#2CD1C0',
|
|
|
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": "A051",
|
|
|
"query_param": [
|
|
|
year, area_name
|
|
|
]
|
|
|
},
|
|
|
"query_cache": 0,
|
|
|
"query_count": [
|
|
|
"total", "studentno"
|
|
|
],
|
|
|
"query_format": "echarts",
|
|
|
"query_group": [
|
|
|
"stage", "citycountrygroup"
|
|
|
]
|
|
|
}), function (resport) {
|
|
|
var data = resport.result;
|
|
|
var newData = JSON.parse(data);
|
|
|
|
|
|
var smallArea = 0;
|
|
|
var smallPerson = 0;
|
|
|
var middleArea = 0;
|
|
|
var middlePerson = 0;
|
|
|
var heightArea = 0;
|
|
|
var heightPerson = 0;
|
|
|
if (newData.datas[0]) {
|
|
|
newData.datas[0].map((item, index) => {
|
|
|
smallArea = smallArea + Number(item);
|
|
|
});
|
|
|
newData.datas2[0].map((item, index) => {
|
|
|
smallPerson = smallPerson + Number(item);
|
|
|
});
|
|
|
}
|
|
|
if (newData.datas[1]) {
|
|
|
newData.datas[1].map((item, index) => {
|
|
|
middleArea = middleArea + Number(item);
|
|
|
});
|
|
|
newData.datas2[1].map((item, index) => {
|
|
|
middlePerson = middlePerson + Number(item);
|
|
|
});
|
|
|
}
|
|
|
if (newData.datas[2]) {
|
|
|
newData.datas[2].map((item, index) => {
|
|
|
heightArea = heightArea + Number(item);
|
|
|
});
|
|
|
newData.datas2[2].map((item, index) => {
|
|
|
heightPerson = heightPerson + Number(item);
|
|
|
});
|
|
|
}
|
|
|
|
|
|
var cityTotal = [(smallArea / smallPerson).toFixed(2), (middleArea / middlePerson).toFixed(2), (heightArea / heightPerson).toFixed(2)];
|
|
|
// 基于准备好的dom，初始化echarts实例
|
|
|
var myChart = echarts.init(document.getElementById('echart5')); // 情况
|
|
|
|
|
|
option = {
|
|
|
title: [{
|
|
|
text: '生均教辅面积情况',
|
|
|
left: 'left',
|
|
|
textStyle: {
|
|
|
color: '#fff',
|
|
|
fontSize: '12',
|
|
|
marginBottom: '1rem',
|
|
|
}
|
|
|
|
|
|
}],
|
|
|
grid: {
|
|
|
left: '0%',
|
|
|
top: '14%',
|
|
|
right: '0%',
|
|
|
bottom: '2%',
|
|
|
containLabel: true
|
|
|
},
|
|
|
tooltip: {
|
|
|
trigger: 'axis',
|
|
|
axisPointer: {
|
|
|
type: 'cross',
|
|
|
}
|
|
|
},
|
|
|
legend: {
|
|
|
data: ['市区', '全国'],
|
|
|
textStyle: {
|
|
|
color: '#fff'
|
|
|
}
|
|
|
},
|
|
|
xAxis: [
|
|
|
{
|
|
|
type: 'category',
|
|
|
data: newData.groups[0],
|
|
|
axisPointer: {
|
|
|
type: 'shadow'
|
|
|
},
|
|
|
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,.4)",
|
|
|
type: 'dashed'
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
type: 'value',
|
|
|
axisLabel: {
|
|
|
//formatter: '{value} %'
|
|
|
show: true,
|
|
|
textStyle: {
|
|
|
color: "rgba(255,255,255,.6)",
|
|
|
fontSize: '12',
|
|
|
},
|
|
|
},
|
|
|
axisTick: {
|
|
|
show: false,
|
|
|
},
|
|
|
axisLine: {
|
|
|
show: false,
|
|
|
},
|
|
|
splitLine: {
|
|
|
lineStyle: {
|
|
|
color: "rgba(255,255,255,.1)",
|
|
|
type: 'dashed'
|
|
|
}
|
|
|
}
|
|
|
// name: '温度',
|
|
|
// min: 0,
|
|
|
// max: 25,
|
|
|
// interval: 5,
|
|
|
// axisLabel: {
|
|
|
// formatter: '{value} °C'
|
|
|
// }
|
|
|
}
|
|
|
],
|
|
|
series: [
|
|
|
{
|
|
|
name: '市区',
|
|
|
type: 'bar',
|
|
|
data: cityTotal,
|
|
|
barWidth: '35%', //柱子宽度
|
|
|
label: {
|
|
|
show: true,
|
|
|
position: 'top'
|
|
|
},
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: '#8882F7',
|
|
|
opacity: 1,
|
|
|
barBorderRadius: 5,
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
name: '全国',
|
|
|
type: 'line',
|
|
|
yAxisIndex: 1,
|
|
|
data: [0, 0, 0],
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: '#FFDB65',
|
|
|
opacity: 1,
|
|
|
barBorderRadius: 5,
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
]
|
|
|
};
|
|
|
|
|
|
|
|
|
// 使用刚指定的配置项和数据显示图表。
|
|
|
myChart.setOption(option);
|
|
|
window.addEventListener("resize", function () {
|
|
|
myChart.resize();
|
|
|
});
|
|
|
}, 'json')
|
|
|
}
|
|
|
function echarts_55(year) {
|
|
|
$.post(config_serverIp + "dataex/report/QuerySimpleGP", JSON.stringify({
|
|
|
"access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
|
|
|
"query": {
|
|
|
"query_id": "A051",
|
|
|
"query_param": [
|
|
|
year, area_name
|
|
|
]
|
|
|
},
|
|
|
"query_cache": 0,
|
|
|
"query_count": [
|
|
|
"total", "studentno"
|
|
|
],
|
|
|
"query_format": "echarts",
|
|
|
"query_group": [
|
|
|
"stage", "citycountrygroup"
|
|
|
]
|
|
|
}), function (resport) {
|
|
|
var data = resport.result;
|
|
|
var newData = JSON.parse(data);
|
|
|
var cityNum = [];// 城区
|
|
|
var townNum = [];// 镇区
|
|
|
var ruralNum = [];// 乡村
|
|
|
newData.datas[0] ? newData.datas[0].map((item, index) => {
|
|
|
cityNum.push(((item / newData.datas2[0][index])).toFixed(2));
|
|
|
}) : '';
|
|
|
newData.datas[1] ? newData.datas[1].map((item, index) => {
|
|
|
townNum.push((item / newData.datas2[1][index]).toFixed(2));
|
|
|
}) : '';
|
|
|
newData.datas[2] ? newData.datas[2].map((item, index) => {
|
|
|
ruralNum.push((item / newData.datas2[2][index]).toFixed(2));
|
|
|
}) : '';
|
|
|
// 基于准备好的dom，初始化echarts实例
|
|
|
var myChart = echarts.init(document.getElementById('echart55')); // 情况
|
|
|
|
|
|
option = {
|
|
|
// backgroundColor: '#00265f',
|
|
|
title: [{
|
|
|
text: '城乡生均教辅面积情况',
|
|
|
left: 'left',
|
|
|
textStyle: {
|
|
|
color: '#fff',
|
|
|
fontSize: '12',
|
|
|
marginBottom: '1rem',
|
|
|
}
|
|
|
|
|
|
}],
|
|
|
tooltip: {
|
|
|
trigger: 'axis',
|
|
|
axisPointer: {
|
|
|
type: 'shadow'
|
|
|
}
|
|
|
},
|
|
|
grid: {
|
|
|
left: '0%',
|
|
|
top: '14%',
|
|
|
right: '0%',
|
|
|
bottom: '4%',
|
|
|
containLabel: true
|
|
|
},
|
|
|
legend: {
|
|
|
data: newData.groups[1],
|
|
|
textStyle: {
|
|
|
color: '#fff'
|
|
|
}
|
|
|
},
|
|
|
xAxis: [{
|
|
|
type: 'category',
|
|
|
data: newData.groups[0],
|
|
|
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: newData.groups[1][0],
|
|
|
type: 'bar',
|
|
|
data: cityNum,
|
|
|
barWidth: '15%', //柱子宽度
|
|
|
// barGap: 1, //柱子之间间距
|
|
|
label: {
|
|
|
show: true,
|
|
|
position: 'top'
|
|
|
},
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: '#168EFE',
|
|
|
opacity: 1,
|
|
|
barBorderRadius: 5,
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
name: newData.groups[1][1],
|
|
|
type: 'bar',
|
|
|
data: townNum,
|
|
|
barWidth: '15%', //柱子宽度
|
|
|
// barGap: 1, //柱子之间间距
|
|
|
label: {
|
|
|
show: true,
|
|
|
position: 'top'
|
|
|
},
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: '#FFDB65',
|
|
|
opacity: 1,
|
|
|
barBorderRadius: 5,
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
name: newData.groups[1][2],
|
|
|
type: 'bar',
|
|
|
data: ruralNum,
|
|
|
barWidth: '15%', //柱子宽度
|
|
|
// barGap: 1, //柱子之间间距
|
|
|
label: {
|
|
|
show: true,
|
|
|
position: 'top'
|
|
|
},
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: '#2CD1C0',
|
|
|
opacity: 1,
|
|
|
barBorderRadius: 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": "A050",
|
|
|
"query_param": [
|
|
|
year, area_name
|
|
|
]
|
|
|
},
|
|
|
"query_cache": 0,
|
|
|
"query_count": [
|
|
|
"total", "studentno"
|
|
|
],
|
|
|
"query_format": "echarts",
|
|
|
"query_group": [
|
|
|
"citycountrygroup", "stage"
|
|
|
]
|
|
|
}), function (resport) {
|
|
|
var data = resport.result;
|
|
|
var newData = JSON.parse(data);
|
|
|
|
|
|
var smallArea = 0;
|
|
|
var smallPerson = 0;
|
|
|
var middleArea = 0;
|
|
|
var middlePerson = 0;
|
|
|
var heightArea = 0;
|
|
|
var heightPerson = 0;
|
|
|
var cityTotal = [];
|
|
|
if (newData.datas[0]) {
|
|
|
newData.datas[0].map((item, index) => {
|
|
|
smallArea = smallArea + Number(item);
|
|
|
});
|
|
|
newData.datas2[0].map((item, index) => {
|
|
|
smallPerson = smallPerson + Number(item);
|
|
|
});
|
|
|
}
|
|
|
if (newData.datas[1]) {
|
|
|
newData.datas[1].map((item, index) => {
|
|
|
middleArea = middleArea + Number(item);
|
|
|
});
|
|
|
newData.datas2[1].map((item, index) => {
|
|
|
middlePerson = middlePerson + Number(item);
|
|
|
});
|
|
|
}
|
|
|
if (newData.datas[2]) {
|
|
|
newData.datas[2].map((item, index) => {
|
|
|
heightArea = heightArea + Number(item);
|
|
|
});
|
|
|
newData.datas2[2].map((item, index) => {
|
|
|
heightPerson = heightPerson + Number(item);
|
|
|
});
|
|
|
}
|
|
|
if (smallArea === 0 || smallPerson === 0) {
|
|
|
cityTotal.push("0");
|
|
|
} else {
|
|
|
cityTotal.push((smallArea / smallPerson).toFixed(2));
|
|
|
}
|
|
|
if (middleArea === 0 || middlePerson === 0) {
|
|
|
cityTotal.push("0");
|
|
|
} else {
|
|
|
cityTotal.push((middleArea / middlePerson).toFixed(2));
|
|
|
}
|
|
|
if (heightArea === 0 || heightPerson === 0) {
|
|
|
cityTotal.push("0");
|
|
|
} else {
|
|
|
cityTotal.push((heightArea / heightPerson).toFixed(2));
|
|
|
}
|
|
|
// 基于准备好的dom，初始化echarts实例
|
|
|
var myChart = echarts.init(document.getElementById('echart6')); // 留守儿童情况
|
|
|
option = {
|
|
|
// backgroundColor: '#00265f',
|
|
|
title: [{
|
|
|
text: '寄宿生生均宿舍面积情况',
|
|
|
left: 'left',
|
|
|
textStyle: {
|
|
|
color: '#fff',
|
|
|
fontSize: '12',
|
|
|
marginBottom: '1rem',
|
|
|
}
|
|
|
|
|
|
}],
|
|
|
tooltip: {
|
|
|
trigger: 'axis',
|
|
|
axisPointer: { type: 'shadow' }
|
|
|
},
|
|
|
grid: {
|
|
|
left: '0%',
|
|
|
top: '14%',
|
|
|
right: '0%',
|
|
|
bottom: '4%',
|
|
|
containLabel: true
|
|
|
},
|
|
|
xAxis: [{
|
|
|
type: 'category',
|
|
|
data: newData.groups[1],
|
|
|
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: cityTotal,
|
|
|
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_7(year) {
|
|
|
$.post(config_serverIp + "dataex/report/QuerySimpleGP", JSON.stringify({
|
|
|
"access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
|
|
|
"query": {
|
|
|
"query_id": "A050",
|
|
|
"query_param": [
|
|
|
year, area_name
|
|
|
]
|
|
|
},
|
|
|
"query_cache": 0,
|
|
|
"query_count": [
|
|
|
"total", "studentno"
|
|
|
],
|
|
|
"query_format": "echarts",
|
|
|
"query_group": [
|
|
|
"stage", "citycountrygroup"
|
|
|
]
|
|
|
}), function (resport) {
|
|
|
var data = resport.result;
|
|
|
var newData = JSON.parse(data);
|
|
|
// debugger
|
|
|
var cityNum = [];// 城区
|
|
|
var townNum = [];// 镇区
|
|
|
var ruralNum = [];// 乡村
|
|
|
|
|
|
// if (newData.datas[0]) {
|
|
|
// newData.datas[0].map((item, index) => {
|
|
|
|
|
|
// cityNum.push(((Number(item)) / Number(newData.datas2[0][index])).toFixed(2));
|
|
|
// })
|
|
|
// }
|
|
|
newData.datas[0] ? newData.datas[0].map((item, index) => {
|
|
|
cityNum.push(((Number(item)) / Number(newData.datas2[0][index])).toFixed(2));
|
|
|
}) : '';
|
|
|
newData.datas[1] ? newData.datas[1].map((item, index) => {
|
|
|
townNum.push((item / newData.datas2[1][index]).toFixed(2));
|
|
|
}) : '';
|
|
|
newData.datas[2] ? newData.datas[2].map((item, index) => {
|
|
|
ruralNum.push((item / newData.datas2[2][index]).toFixed(2));
|
|
|
}) : '';
|
|
|
// 基于准备好的dom，初始化echarts实例
|
|
|
var myChart = echarts.init(document.getElementById('echart7')); //
|
|
|
|
|
|
option = {
|
|
|
// backgroundColor: '#00265f',
|
|
|
title: [{
|
|
|
text: '城乡生均宿舍面积情况',
|
|
|
left: 'left',
|
|
|
textStyle: {
|
|
|
color: '#fff',
|
|
|
fontSize: '12',
|
|
|
marginBottom: '1rem',
|
|
|
}
|
|
|
|
|
|
}],
|
|
|
tooltip: {
|
|
|
trigger: 'axis',
|
|
|
axisPointer: {
|
|
|
type: 'shadow'
|
|
|
}
|
|
|
},
|
|
|
grid: {
|
|
|
left: '0%',
|
|
|
top: '14%',
|
|
|
right: '0%',
|
|
|
bottom: '4%',
|
|
|
containLabel: true
|
|
|
},
|
|
|
legend: {
|
|
|
data: newData.groups[1],
|
|
|
textStyle: {
|
|
|
color: '#fff'
|
|
|
}
|
|
|
},
|
|
|
xAxis: [{
|
|
|
type: 'category',
|
|
|
data: newData.groups[0],
|
|
|
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: newData.groups[1][0],
|
|
|
type: 'bar',
|
|
|
data: cityNum,
|
|
|
barWidth: '15%', //柱子宽度
|
|
|
// barGap: 1, //柱子之间间距
|
|
|
label: {
|
|
|
show: true,
|
|
|
position: 'top'
|
|
|
},
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: '#168EFE',
|
|
|
opacity: 1,
|
|
|
barBorderRadius: 5,
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
name: newData.groups[1][1],
|
|
|
type: 'bar',
|
|
|
data: townNum,
|
|
|
barWidth: '15%', //柱子宽度
|
|
|
// barGap: 1, //柱子之间间距
|
|
|
label: {
|
|
|
show: true,
|
|
|
position: 'top'
|
|
|
},
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: '#FFDB65',
|
|
|
opacity: 1,
|
|
|
barBorderRadius: 5,
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
{
|
|
|
name: newData.groups[1][2],
|
|
|
type: 'bar',
|
|
|
data: ruralNum,
|
|
|
barWidth: '15%', //柱子宽度
|
|
|
// barGap: 1, //柱子之间间距
|
|
|
label: {
|
|
|
show: true,
|
|
|
position: 'top'
|
|
|
},
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: '#2CD1C0',
|
|
|
opacity: 1,
|
|
|
barBorderRadius: 5,
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
]
|
|
|
};
|
|
|
|
|
|
// 使用刚指定的配置项和数据显示图表。
|
|
|
myChart.setOption(option);
|
|
|
window.addEventListener("resize", function () {
|
|
|
myChart.resize();
|
|
|
});
|
|
|
}, 'json');
|
|
|
}
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
