|
|
|
|
|
$(function () {
|
|
|
$('#cityMap').click(function (event) {
|
|
|
$(this).addClass('active');
|
|
|
$(this).siblings().removeClass('active');
|
|
|
map(1, config_now_year);
|
|
|
})
|
|
|
$('#otherMap').click(function (event) {
|
|
|
$(this).addClass('active');
|
|
|
$(this).siblings().removeClass('active');
|
|
|
map(2, config_now_year);
|
|
|
})
|
|
|
|
|
|
map(1, config_now_year);
|
|
|
function map(type, year) {
|
|
|
$.post(config_serverIp + "dataex/report/QuerySimpleGP", JSON.stringify({
|
|
|
"access_token": "system_01##20200102030405##a6ce11eab94df48a6ce11eab",
|
|
|
"query": {
|
|
|
"query_id": "A078",
|
|
|
"query_param": [
|
|
|
year
|
|
|
]
|
|
|
},
|
|
|
"query_cache": 0,
|
|
|
"query_count": [
|
|
|
"total"
|
|
|
],
|
|
|
"query_format": "echarts",
|
|
|
"query_group": [
|
|
|
"stage", "gatherregionc"
|
|
|
]
|
|
|
}), function (resport) {
|
|
|
var data = resport.result;
|
|
|
var indata = JSON.parse(data);
|
|
|
var areaList = [];
|
|
|
var schoolList = [];
|
|
|
indata.groups[1].map((item, index) => {
|
|
|
schoolList = [];
|
|
|
indata.datas[index].map((res, number) => {
|
|
|
|
|
|
if (number <= indata.datas[index].length - 1) {
|
|
|
if (res === "") {
|
|
|
schoolList.push({ schoolType: indata.groups[0][number], schoolNmber: 0 })
|
|
|
} else {
|
|
|
schoolList.push({ schoolType: indata.groups[0][number], schoolNmber: res })
|
|
|
}
|
|
|
}
|
|
|
})
|
|
|
areaList.push({ name: item, schoolList: schoolList });
|
|
|
})
|
|
|
areaList
|
|
|
|
|
|
// 基于准备好的dom，初始化echarts实例
|
|
|
var myChart = echarts.init(document.getElementById("map_1"));
|
|
|
option1 = {
|
|
|
// backgroundColor: '#404a59',
|
|
|
/*** title: {
|
|
|
text: '实时行驶车辆',
|
|
|
subtext: 'data from PM25.in',
|
|
|
sublink: 'http://www.pm25.in',
|
|
|
left: 'center',
|
|
|
textStyle: {
|
|
|
color: '#fff'
|
|
|
}
|
|
|
},**/
|
|
|
tooltip: {
|
|
|
trigger: "item",
|
|
|
formatter: function (params) {
|
|
|
if (params.data) {
|
|
|
var res = '<div class="boxall" style="margin: 0;padding:0 0.1rem"><p style="color: #fff">小学：' + params.data.schoolList[0].schoolNmber +
|
|
|
'</p><p style="color: #fff">初级中学：' + params.data.schoolList[1].schoolNmber +
|
|
|
'</p><p style="color: #fff">九年一贯制学校：' + params.data.schoolList[2].schoolNmber +
|
|
|
'</p><p style="color: #fff">完全中学：' + params.data.schoolList[3].schoolNmber +
|
|
|
'</p><p style="color: #fff">高级中学：' + params.data.schoolList[4].schoolNmber +
|
|
|
'</p><p style="color: #fff">十二年一贯制学校：' + params.data.schoolList[5].schoolNmber + '</p>' +
|
|
|
' <div class="boxfoot"></div></div>';
|
|
|
return res;
|
|
|
} else {
|
|
|
return '';
|
|
|
}
|
|
|
},
|
|
|
},
|
|
|
|
|
|
geo: {
|
|
|
map: "changchun",
|
|
|
label: {
|
|
|
normal: {
|
|
|
show: true, //省份名称
|
|
|
textStyle: {
|
|
|
color: '#ffd437'
|
|
|
}
|
|
|
},
|
|
|
emphasis: {
|
|
|
show: false,
|
|
|
},
|
|
|
},
|
|
|
nameMap: {},
|
|
|
roam: false, //禁止其放大缩小
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
areaColor: "#4c60ff",
|
|
|
borderColor: "#002097",
|
|
|
},
|
|
|
emphasis: {
|
|
|
areaColor: "#293fff",
|
|
|
borderColor: "#fff",
|
|
|
},
|
|
|
},
|
|
|
regions: [
|
|
|
{
|
|
|
name: '榆树市',
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#6DDEFF',
|
|
|
},
|
|
|
emphasis: {
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0,
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#6DDEFF',
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
|
|
|
{
|
|
|
name: '德惠市',
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#50D1F9',
|
|
|
},
|
|
|
emphasis: {
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0,
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#50D1F9',
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
|
|
|
{
|
|
|
name: '九台区',
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#22ACF7',
|
|
|
},
|
|
|
emphasis: {
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0,
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#22ACF7',
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
|
|
|
{
|
|
|
name: '农安县',
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#1286FD',
|
|
|
},
|
|
|
emphasis: {
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0,
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#1286FD',
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
|
|
|
{
|
|
|
name: '二道区',
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#109DFF',
|
|
|
},
|
|
|
emphasis: {
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0,
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#109DFF',
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
|
|
|
{
|
|
|
name: '双阳区',
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#1076FE',
|
|
|
},
|
|
|
emphasis: {
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0,
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#1076FE',
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
|
|
|
{
|
|
|
name: '宽城区',
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#1191FE',
|
|
|
},
|
|
|
emphasis: {
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0,
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#1191FE',
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
|
|
|
{
|
|
|
name: '绿园区',
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#0366FE',
|
|
|
},
|
|
|
emphasis: {
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0,
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#0366FE',
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
|
|
|
{
|
|
|
name: '南关区',
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#0580FC',
|
|
|
},
|
|
|
emphasis: {
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0,
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#0580FC',
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
|
|
|
{
|
|
|
name: '公主岭市',
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#0066FF',
|
|
|
},
|
|
|
emphasis: {
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0,
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#0066FF',
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
|
|
|
{
|
|
|
name: '朝阳区',
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#035EEA',
|
|
|
},
|
|
|
emphasis: {
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0,
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#035EEA',
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
|
|
|
],
|
|
|
},
|
|
|
series: [
|
|
|
{
|
|
|
name: "学校数量",
|
|
|
type: "map",
|
|
|
map: "changchun",
|
|
|
coordinateSystem: "geo",
|
|
|
// data: [
|
|
|
// { name: '南关区', schoolNum: '191' },
|
|
|
// { name: '宽城区', schoolNum: '191' },
|
|
|
// { name: '朝阳区', schoolNum: '191' },
|
|
|
// { name: '二道区', schoolNum: '191' },
|
|
|
// { name: '绿园区', schoolNum: '191' },
|
|
|
// { name: '双阳区', schoolNum: '191' },
|
|
|
// { name: '九台区', schoolNum: '191' },
|
|
|
// { name: '农安县', schoolNum: '191' },
|
|
|
// { name: '榆树市', schoolNum: '191' },
|
|
|
// { name: '德惠市', schoolNum: '191' },
|
|
|
// { name: '公主岭市', schoolNum: '191' },
|
|
|
// ],
|
|
|
data: areaList,
|
|
|
label: {
|
|
|
normal: {
|
|
|
formatter: "{b}",
|
|
|
position: "right",
|
|
|
show: false,
|
|
|
},
|
|
|
emphasis: {
|
|
|
show: true,
|
|
|
},
|
|
|
},
|
|
|
itemStyle: {
|
|
|
normal: {
|
|
|
color: "#ffeb7b",
|
|
|
opacity: '0',
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
],
|
|
|
};
|
|
|
|
|
|
option2 = {
|
|
|
// backgroundColor: '#404a59',
|
|
|
/*** title: {
|
|
|
text: '实时行驶车辆',
|
|
|
subtext: 'data from PM25.in',
|
|
|
sublink: 'http://www.pm25.in',
|
|
|
left: 'center',
|
|
|
textStyle: {
|
|
|
color: '#fff'
|
|
|
}
|
|
|
},**/
|
|
|
tooltip: {
|
|
|
trigger: "item",
|
|
|
formatter: function (params) {
|
|
|
if (params.data) {
|
|
|
var res = '<div class="boxall" style="margin: 0;padding:0 0.1rem"><p style="color: #fff">小学：' + params.data.schoolList[0].schoolNmber +
|
|
|
'</p><p style="color: #fff">初级中学：' + params.data.schoolList[1].schoolNmber +
|
|
|
'</p><p style="color: #fff">九年一贯制学校：' + params.data.schoolList[2].schoolNmber +
|
|
|
'</p><p style="color: #fff">完全中学：' + params.data.schoolList[3].schoolNmber +
|
|
|
'</p><p style="color: #fff">高级中学：' + params.data.schoolList[4].schoolNmber +
|
|
|
'</p><p style="color: #fff">十二年一贯制学校：' + params.data.schoolList[5].schoolNmber + '</p>' +
|
|
|
' <div class="boxfoot"></div></div>';
|
|
|
return res;
|
|
|
} else {
|
|
|
return '';
|
|
|
}
|
|
|
},
|
|
|
},
|
|
|
|
|
|
geo: {
|
|
|
map: "kaifaqu",
|
|
|
label: {
|
|
|
show: true,
|
|
|
color: "#fff"
|
|
|
},
|
|
|
// label: {
|
|
|
// backgroundColor: '#ccc',
|
|
|
// textBorderColor: '#000',
|
|
|
// show: true,
|
|
|
// // normal: {
|
|
|
// // , //省份名称
|
|
|
// // textStyle: {
|
|
|
// // color: '#000'
|
|
|
// // }
|
|
|
// // },
|
|
|
// emphasis: {
|
|
|
// show: true,
|
|
|
// },
|
|
|
// },
|
|
|
nameMap: {},
|
|
|
roam: false, //禁止其放大缩小
|
|
|
itemStyle: {
|
|
|
areaColor: "#ccc",
|
|
|
borderColor: "#333",
|
|
|
},
|
|
|
// emphasis: {
|
|
|
// itemStyle: {
|
|
|
// areaColor: "#00dd00",
|
|
|
// borderColor: "#333",
|
|
|
// }
|
|
|
|
|
|
// },
|
|
|
regions: [
|
|
|
{
|
|
|
name: '净月区代管',
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#168EFE',
|
|
|
},
|
|
|
emphasis: {
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0,
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#00ddaa',
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
|
|
|
{
|
|
|
name: '莲花山度假区代管',
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#1286FD',
|
|
|
},
|
|
|
emphasis: {
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0,
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#1286FD',
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
|
|
|
{
|
|
|
name: '新区代管',
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#6DDEFF',
|
|
|
},
|
|
|
emphasis: {
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0,
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#6DDEFF',
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
|
|
|
{
|
|
|
name: '汽车区代管',
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#22ACF7',
|
|
|
},
|
|
|
emphasis: {
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0,
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#22ACF7',
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
|
|
|
{
|
|
|
name: '经开区代管',
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#0066FF',
|
|
|
},
|
|
|
emphasis: {
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0,
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#0066FF',
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
|
|
|
{
|
|
|
name: '新区代管',
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#6DDEFF',
|
|
|
},
|
|
|
emphasis: {
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0,
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#6DDEFF',
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
|
|
|
{
|
|
|
name: '新区代管',
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#6DDEFF',
|
|
|
},
|
|
|
emphasis: {
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0,
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#6DDEFF',
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
|
|
|
{
|
|
|
name: '新区代管',
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#6DDEFF',
|
|
|
},
|
|
|
emphasis: {
|
|
|
label: {
|
|
|
color: '#fff',
|
|
|
borderWidth: 0,
|
|
|
},
|
|
|
itemStyle: {
|
|
|
areaColor: '#6DDEFF',
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
|
|
|
],
|
|
|
},
|
|
|
|
|
|
series: [
|
|
|
{
|
|
|
type: 'map',
|
|
|
roam: false,
|
|
|
map: 'kaifaqu',
|
|
|
nameProperty: 'name',
|
|
|
coordinateSystem: "geo",
|
|
|
lable: {
|
|
|
show: true,
|
|
|
},
|
|
|
itemStyle: {
|
|
|
opacity: '0',
|
|
|
},
|
|
|
data: areaList,
|
|
|
|
|
|
// data: [
|
|
|
// { name: '北湖区', value: 4822023, new: 1 },
|
|
|
// { name: '高新区', value: 731449, new: 1 },
|
|
|
// { name: '经开区', value: 6553255, new: 0 },
|
|
|
// { name: '净月区', value: 2949131, new: 0 },
|
|
|
// { name: '莲花山', value: 38041430, new: 0 },
|
|
|
// { name: '汽开区', value: 5187582, new: 0 },
|
|
|
// { name: '长德区', value: 3590347, new: 1 },
|
|
|
// { name: '空港区', value: 917092, new: 1 },
|
|
|
// ]
|
|
|
},
|
|
|
],
|
|
|
};
|
|
|
|
|
|
if (type === 1) {
|
|
|
myChart.setOption(option1);
|
|
|
} else {
|
|
|
myChart.setOption(option2);
|
|
|
}
|
|
|
|
|
|
window.addEventListener("resize", function () {
|
|
|
myChart.resize();
|
|
|
});
|
|
|
|
|
|
//点击事件,根据点击某个省份计算出这个省份的数据
|
|
|
myChart.on('click', function (params) {
|
|
|
if (params.name) {
|
|
|
window.location.href = "areaIndex.html?area_name=" + params.name + "&year=" + config_now_year;
|
|
|
}
|
|
|
});
|
|
|
})
|
|
|
}
|
|
|
})
|
