饼状图样式
代码
function currentCount(data){
var levelOption = {
title:{
show:true,
text:"告警级别",
x:"center",
y : 130
},
tooltip:{
formatter:"{a} <br/>{b}级别 : {c}个 (所占比例{d}%)",
show:true,
trigger:"item"
},
color :[
"#C0C0C0",
],
legend:{
data:[],
x:"center",
y:"bottom"
},
series:[{
data:[{name:"",value:""}],
type:"pie",
name:"按告警级别统计",
radius:["40%","55%"]
}],
}
var typeOption = {
title:{
show:true,
text:"告警类别",
x:"center",
y : 130
},
tooltip:{
formatter:"{a} <br/>{b}类别 : {c}个 (所占比例{d}%)",
show:true,
trigger:"item"
},
color :[
"#C0C0C0",
],
legend:{
data:[],
x:"center",
y:"bottom"
},
series:[{
data:[{name:"",value:""}],
type:"pie",
name:"按告警类别统计",
radius:["40%","55%"]
}],
}
//当前告警统计饼状图
$ajax(countJsonUrl,"post",data,function(option){
myChartAlevelPie.clear();
myChartAtypePie.clear();
if(option.success){
function Data(name,value){
this.name = name;
this.value = value;
}
if(option.obj.levelDatas){
var levelDatas = option.obj.levelDatas;
var levelSeriesDatasEharts = new Array();
var levelLegendDatasEharts = new Array();
for(var i=levelDatas.length; i>0; i--){
var levelData = levelDatas.shift();
var data = new Data(levelData.alarmLevel,levelData.quantum);
levelSeriesDatasEharts.push(data);
levelLegendDatasEharts.push(levelData.alarmLevel);
}
levelOption.series[0].data = levelSeriesDatasEharts;
levelOption.legend.data = levelLegendDatasEharts;
}
if(option.obj.typeDatas){
var typeDatas = option.obj.typeDatas;
var typeSeriesDatasEharts = new Array();
var typeLegendDatasEharts = new Array();
for(var i=typeDatas.length; i>0; i--){
var typeData = typeDatas.shift();
var data = new Data(typeData.alarmType,typeData.quantum);
typeSeriesDatasEharts.push(data);
typeLegendDatasEharts.push(typeData.alarmType);
}
typeOption.series[0].data = typeSeriesDatasEharts;
typeOption.legend.data = typeLegendDatasEharts;
}
myChartAlevelPie.hideLoading();
myChartAtypePie.hideLoading();
myChartAtypePie.setOption(typeOption);
myChartAlevelPie.setOption(levelOption);
var typeInfo = document.getElementById('alarmTypeInfo');
if(option.obj.typeInfo){
var typeInfos = option.obj.typeInfo;
var temp = "";
for(var i=typeInfos.length; i>0; i--){
temp += "<span>"+ typeInfos.shift() +"</span><br>"
}
console.info(temp);
typeInfo.innerHTML = temp;
}
var levelInfo = document.getElementById('alarmAlevelInfo');
if(option.obj.levelInfo){
var levelInfos = option.obj.levelInfo;
var temp = "";
for(var i=levelInfos.length; i>0; i--){
temp += "<span>"+ levelInfos.shift() +"</span><br>"
}
levelInfo.innerHTML = temp;
}
}else{
myChartAtypePie.setOption(typeOption);
myChartAlevelPie.setOption(levelOption);
myChartAtypePie.showLoading({text: '无数据',color: '#c23531',zlevel: 0});
myChartAlevelPie.showLoading({text: '无数据',color: '#c23531',zlevel: 0});
}
});
}