$(document).ready(function () { //辅助决策 人口统计 默认数据 - 各街道人口数量总数 var temp = new Object(); var array = new Array(); temp.jdRenKou = array; array.push({ "jdId" : 170387468639, "jdName" : "锦程街道办事处", "rkNumber" : 0 }); array.push({ "jdId" : 172291278969, "jdName" : "东风街道办事处", "rkNumber" : 0 }); array.push({ "jdId" : 288313983755, "jdName" : "富民街道办事处", "rkNumber" : 0 }); array.push({ "jdId" : 288313983756, "jdName" : "前程街道办事处", "rkNumber" : 0 }); qiKaiQuJuMinZongShu(temp); var obj = new Object(); $.ajax({ url : prefix + "/queryRenKouJieDao", method : 'post', data : obj, success : function (e) { if(e.code == 0){ e.jdRenKou = $.parseJSON(e.jdRenKou); qiKaiQuJuMinZongShu(e); } } }); }); function qiKaiQuJuMinZongShu(e){ var jdRenKou = e.jdRenKou;//各个街道人口数量总数 var jdNames = new Array(); var rkNumbers = new Array(); for (var i = 0; i < jdRenKou.length; i++) { jdNames.push(jdRenKou[i].jdName); var rkNumber_bar = { value: jdRenKou[i].rkNumber, itemStyle: { } } rkNumbers.push(rkNumber_bar); } var chartDom = document.getElementById('echarts_jmzs'); var myChart = echarts.init(chartDom); var option; option = { tooltip: { trigger: 'axis', axisPointer: { type: 'shadow' }, show: true, //trigger: 'item', triggerOn: 'click', enterable: true, extraCssText: 'z-index: 99;max-width: 100px;white-space:pre-wrap', formatter: function(params) { const result = params[0]; var dataIndex = result.dataIndex; var name = result.name; openDialog_juMin(name); } }, grid: { left: '8%', right: '5%', bottom: '3%', top: '10%', containLabel: true, }, xAxis: { axisLine: { show: false }, axisLabel: { show: false }, splitLine: { show: false }, }, yAxis: { type: 'category', data: jdNames, axisLine: { show: false, lineStyle: { color: '#00cdef' } }, axisTick: { show: false }, }, series: [{ type: 'bar', barWidth:45, itemStyle: { //上方显示数值 normal: { label: { show: true, //开启显示 position: 'insideLeft', //在上方显示 textStyle: { //数值样式 color: 'white', fontSize: 11 } }, color: new echarts.graphic.LinearGradient(1, 1, 0, 0, [{ offset: 0, color: '#19c8ad' }, { offset: 1, color: '#0477f7' }]), } }, data: rkNumbers }] }; myChart.setOption(option); } $(document).ready(function () {//弹出对话框 $('#openDialogJuMin').on('click', function () { var jdId = -1; var url = prefix + "/rktj/qkqjmzs/" + jdId; $.modal.openDetailFull("汽开区居民总数", url, 1200) }); }) function openDialog_juMin(name) {//弹出对话框 var obj = new Object(); obj.deptName = name; $.ajax({ url : "system/dept/list", method : 'post', data : obj, success : function (e) { if(e.length > 0){ var jdId = e[0].deptId; var url = prefix + "/rktj/qkqjmzs/" + jdId; $.modal.openDetailFull("汽开区居民总数", url, 1200); } } }); }