$(document).ready(function () { //辅助决策 人口统计 默认数据 - 空挂人口情况统计 var isLoading = true; var temp = new Object(); var kongGua = new Object(); temp.kongGua = kongGua; kongGua.rkKongGuaYes = 0; kongGua.rkKongGuaNo = 0; kongGuaRenKou(temp, isLoading); feiFongGuaRenKou(temp, isLoading); var obj = new Object(); $.ajax({ url : prefix + "/queryRenKouKongGua", method : 'post', data : obj, success : function (e) { if(e.code == 0){ e.kongGua = $.parseJSON(e.kongGua); isLoading = false; kongGuaRenKou(e, isLoading); feiFongGuaRenKou(e ,isLoading); } } }); }); function kongGuaRenKou(e, isLoading) { var rkKongGuaYes = e.kongGua.rkKongGuaYes;//空挂人口 var rkKongGuaNo = e.kongGua.rkKongGuaNo;//非空挂人数 var chartDom = document.getElementById('echarts_kgrk'); var myChart = echarts.init(chartDom); if(!isLoading){ myChart.on("click", function (e) { openDialog_kongGua(e.dataIndex); }); } var colors0 = ['#177c3d', '#1c86b2', '#3043f2', '#3414d9']; var colors1 = ['#2dc94a', '#00ffcc', '#30b9f2', '#5519ff']; var option; option = { tooltip: { trigger: 'item' }, series: [ { name: '空挂人口', type: 'pie', radius: ['40%', '70%'], avoidLabelOverlap: false, label: { show: false, position: 'center' }, emphasis: { label: { show: true, fontSize: '15', fontWeight: 'bold', color:'83bff6' } }, labelLine: { show: false }, itemStyle: { }, data: [ { value: rkKongGuaYes, name: '空挂人数' , itemStyle: { color: new echarts.graphic.LinearGradient(1, 1, 0, 0, [{ offset: 0, color: '#1270d9' }, { offset: 1, color: '#00ffeb' }]), }, }, { value: rkKongGuaNo, name: '非空挂人数', itemStyle: { color: new echarts.graphic.LinearGradient(1, 1, 0, 0, [{ offset: 0, color: '#ff8404' }, { offset: 1, color: '#ffd904' }]), }, } // { value: 27, name: 'Search Engine' }, // { value: 5, name: 'Direct' } ] } ] }; option && myChart.setOption(option); } function feiFongGuaRenKou(e, isLoading) { var rkKongGuaYes = e.kongGua.rkKongGuaYes;//空挂人口 var rkKongGuaNo = e.kongGua.rkKongGuaNo;//非空挂人数 var chartDom = document.getElementById('echarts_fkgrk'); var myChart = echarts.init(chartDom); if(!isLoading){ myChart.on("click", function (e) { openDialog_kongGua(1 - e.dataIndex); }); } var option; option = { tooltip: { trigger: 'item' }, series: [ { name: '非空挂人数', type: 'pie', radius: ['40%', '70%'], avoidLabelOverlap: false, label: { show: false, position: 'center' }, emphasis: { label: { show: true, fontSize: '15', fontWeight: 'bold', color:'83bff6' } }, labelLine: { show: false }, itemStyle: { // color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ // { offset: 0, color: '#83bff6' }, // { offset: 0.5, color: '#70c573' }, // { offset: 1, color: '#70c573' } // ]) }, data: [ { value: rkKongGuaNo, name: '非空挂人数', itemStyle: { color: new echarts.graphic.LinearGradient(1, 1, 0, 0, [{ offset: 0, color: '#1270d9' }, { offset: 1, color: '#00ffeb' }]), } }, { value: rkKongGuaYes, name: '空挂人数' , itemStyle: { color: new echarts.graphic.LinearGradient(1, 1, 0, 0, [{ offset: 0, color: '#ff8404' }, { offset: 1, color: '#ffd904' }]), } } // { value: 27, name: 'Search Engine' }, // { value: 5, name: 'Direct' } ] } ] }; option && myChart.setOption(option); } function openDialog_kongGua(index) {//弹出对话框 console.log(index+"=index") var title = index==0?'空挂人口统计':'非空挂人口统计'; var url = prefix + "/rktj/kgrkqktj/" + index; $.modal.openDetailFull(title, url, 1200); }