ECharts展示后台数据

标签：

/**
* Created by Administrator on 2015/11/10 010.
*/

var home = function (){

//项目预警分析
var getProAlarmData = function (type) {
var postData = {"dictKey":"statistics_type"};
$.ajax({
"url":basicPath + "/admin/sys/report/getChartData",
"type":"post",
"contentType": "application/json",
"data" : JSON.stringify(postData),
"success":function(json){
if(json.status = "SUCCESS") {

var legend = [] ,
xAxis = [] ,
series = [] ;

$(json.responseData).each(function(i ,e){
if($.inArray(this.xAxis, xAxis) < 0 ) xAxis.push(this.xAxis);
if($.inArray(this.series, legend) < 0 ) {
legend.push(this.series);
var indexs = series.length;
series[indexs] = {};
series[indexs].name = this.series;
series[indexs].type = type;
series[indexs].data = [];
series[indexs].data.push(this.value);

} else {
var indexs = $.inArray(this.series, legend);
if($.isEmptyObject(series[indexs])) {
series[indexs] = {};
series[indexs].data = [];
}
series[indexs].name = this.series;
series[indexs].type = type;
series[indexs].data.push(this.value);
}
});
handleProAlarm(legend, xAxis, series);
} else {}

}
});
};

//模块报警
var getModuleAlarmData = function (type) {
var postData = {"dictKey":"statistics_type"};
$.ajax({
"url":basicPath + "/admin/sys/report/getChartDataSeries",
"type":"post",
"contentType": "application/json",
"data" : JSON.stringify(postData),
"success":function(json){
if(json.status = "SUCCESS") {

var xAxis = [] ,
series = [] ;

$(json.responseData).each(function(i ,e){
if($.inArray(this.xAxis, xAxis) < 0 ) xAxis.push(this.series);
if($.inArray(this.series, series) < 0 ) series.push(this.value);

});
handleModuleAlarm(xAxis, series);
} else {}

}
});
};

//项目报警
var getAlarmData = function (type) {
var postData = {"dictKey":"statistics_type"};
$.ajax({
"url":basicPath + "/admin/sys/report/getChartDataXaxisTop5",
"type":"post",
"contentType": "application/json",
"data" : JSON.stringify(postData),
"success":function(json){
if(json.status = "SUCCESS") {

var legend = [] ,
series = [] ;

$(json.responseData).each(function(i ,e){
if($.inArray(this.xAxis, legend) < 0 ) legend.push(this.xAxis);
series.push({"name":this.xAxis, "value": this.value});

});
handleAlarm(legend, series);
} else {}

}
});
};

//地图数据
var getMapData = function (type) {
var postData = {"dictKey":"statistics_type"};
$.ajax({
"url":basicPath + "/admin/sys/report/getChartDataXaxis",
"type":"post",
"contentType": "application/json",
"data" : JSON.stringify(postData),
"success":function(json){
if(json.status = "SUCCESS") {

var geoCoord = {} ,
series = [] ;

$(json.responseData).each(function(i ,e){
//geoCoord.push(this.xAxis+":"+this.value);
var xy = String(this.xy).split(‘,‘),
location = [];
location[0] = xy[0];
location[1] = xy[1];
geoCoord[this.xAxis] = location;
series.push({"name":this.xAxis, "value": this.value});

});
//console.log(geoCoord);
//console.log(series);
handleMap(geoCoord, series);
} else {}

}
});
};

//初始化地图数据
var handleMap = function (geoCoord, series) {

var option = {
title : {
text: ‘全国项目分布图‘,
x:‘center‘
},
tooltip : {
trigger: ‘item‘,
formatter: "{b} : {c}"
},

dataRange: {
min : 0,
max : 100,
calculable : true,
color: [‘maroon‘,‘purple‘,‘red‘,‘orange‘,‘yellow‘,‘lightgreen‘]
},

series : [
{
name: ‘项目‘,
type: ‘map‘,
mapType: ‘china‘,
hoverable: false,
roam:true,
data : [],
markPoint : {
symbolSize: 5, // 标注大小，半宽（半径）参数，当图形为方向或菱形则总宽度为symbolSize * 2
itemStyle: {
normal: {
borderColor: ‘#87cefa‘,
borderWidth: 1, // 标注边线线宽，单位px，默认为1
label: {
show: false
}
},
emphasis: {
borderColor: ‘#1e90ff‘,
borderWidth: 5,
label: {
show: false
}
}
},
data : series
},
geoCoord: geoCoord
}
]
};

myChart = echarts.init($("#site_project")[0]);
window.onresize = myChart.resize;
myChart.setOption(option, true)

};

//初始化
var handleAlarm = function (legend, series) {

var option = {
title : {
text: ‘项目设备报警分析TOP5‘,
x:‘center‘
},
tooltip : {
trigger: ‘item‘,
formatter: "{a} : {c}"
},
legend: {
//orient : ‘horizontal‘,
orient : ‘vertical‘,
x : ‘right‘,
//y : ‘bottom‘,
data:legend
},

series : [
{
name:‘报警数‘,
type:‘pie‘,
radius : ‘55%‘,
center: [‘50%‘, ‘60%‘],
data:series
}
]
};

myChart = echarts.init($("#site_alarm")[0]);
window.onresize = myChart.resize;
myChart.setOption(option, true)
};

//初始化模块报警分析
var handleModuleAlarm = function (xAxis, series) {
var option = {
title : {
text: ‘模块报警分析‘,
x:‘center‘
},
tooltip : {
trigger: ‘axis‘
},
xAxis : [
{
type : ‘category‘,
data : xAxis
}
],
yAxis : [
{
type : ‘value‘
}
],
series : [
{
name:‘报警量‘,
type:‘bar‘,
data:series

}
]
};

myChart = echarts.init($("#site_modalalarm")[0]);
window.onresize = myChart.resize;
myChart.setOption(option, true)

};

//初始化项目报警分析
var handleProAlarm = function (legend, xAxis, series) {
var option = {
title : {
text: ‘项目报警分析‘,
x:‘center‘
},
tooltip : {
trigger: ‘axis‘
},
legend: {
y: ‘bottom‘,
data:legend
},

xAxis : [
{
type : ‘category‘,
boundaryGap : false,
data : xAxis
}
],
yAxis : [
{
type : ‘value‘
}
],
series : series
};

myChart = echarts.init($("#site_proalarm")[0]);
window.onresize = myChart.resize;
myChart.setOption(option, true)

};

return {
init:function(){
//handleMap();
getMapData();
//handleAlarm();
getAlarmData();
//handleModuleAlarm();
getModuleAlarmData(‘bar‘);
//handleProAlarm();
getProAlarmData(‘line‘);
}
}
}();

ECharts展示后台数据

标签：

原文地址：http://www.cnblogs.com/JaxYoun/p/5760479.html