餅狀圖樣式

代碼

function currentCount(data){var levelOption = {title:{show:true,text:"告警級別",x:"center",y : 130},tooltip:{formatter:"{a} <br/>{b}級別 : {c}個 (所占比例ze8trgl8bvbq%)",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}個 (所占比例ze8trgl8bvbq%)",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});}});}

總結

以上是生活随笔為你收集整理的一段echats 饼状图刷新代码的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。