|
|
// 长春市教育发展--近三年办学条件发展状况
|
|
|
|
|
|
$(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')
|
|
|
}
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
