| | |
| | | export class ReportComponent implements OnInit { |
| | | [x: string]: any; |
| | | |
| | | public spinning: boolean = true; |
| | | public spinning = true; |
| | | |
| | | private echartOption = { |
| | | backgroundColor: '', |
| | |
| | | } |
| | | } |
| | | |
| | | private pieCharOption: any = { |
| | | title: { |
| | | text: 'AQI指标报警占比情况', |
| | | x: 'center' |
| | | }, |
| | | tooltip: { |
| | | trigger: 'item', |
| | | formatter: '{a} <br/>{b}: {c} ({d}%)' |
| | | }, |
| | | legend: { |
| | | // x : 'center', |
| | | top: '10%', |
| | | data: ['PM 2.5', 'PM 10', '一氧化碳(CO)', '二氧化硫(SO₂)', '臭氧(O₃)', '二氧化氮(NO₂)'] |
| | | }, |
| | | graphic: [{ |
| | | type: 'text', |
| | | left: '24%', |
| | | top: '49%', |
| | | style: { |
| | | text: '大华涂料' |
| | | } |
| | | }, { |
| | | type: 'text', |
| | | left: '74%', |
| | | top: '49%', |
| | | style: { |
| | | text: '{b}' |
| | | } |
| | | } |
| | | ], |
| | | series: [ |
| | | { |
| | | name: '访问来源', |
| | | type: 'pie', |
| | | radius: ['30%', '50%'], |
| | | center: ['25%', '50%'], |
| | | label: { |
| | | normal: { |
| | | formatter: '{b}:{d}%' |
| | | } |
| | | }, |
| | | labelLine: { |
| | | normal: { |
| | | show: true |
| | | } |
| | | }, |
| | | data: [ |
| | | {value: 100, name: 'PM 2.5'}, |
| | | {value: 100, name: 'PM 10'}, |
| | | {value: 200, name: '一氧化碳(CO)'}, |
| | | {value: 200, name: '二氧化硫(SO₂)'}, |
| | | {value: 100, name: '臭氧(O₃)'}, |
| | | {value: 100, name: '二氧化氮(NO₂)'} |
| | | ] |
| | | }, |
| | | { |
| | | name: '访问来源', |
| | | type: 'pie', |
| | | radius: ['30%', '50%'], |
| | | center: ['75%', '50%'], |
| | | label: { |
| | | normal: { |
| | | formatter: '{b}:{d}%', |
| | | } |
| | | }, |
| | | labelLine: { |
| | | normal: { |
| | | show: true, |
| | | } |
| | | }, |
| | | data: [ |
| | | {value: 0, name: 'PM 2.5'}, |
| | | {value: 0, name: 'PM 10'}, |
| | | {value: 100, name: '一氧化碳(CO)'}, |
| | | {value: 100, name: '二氧化硫(SO₂)'}, |
| | | {value: 100, name: '臭氧(O₃)'}, |
| | | {value: 100, name: '二氧化氮(NO₂)'} |
| | | |
| | | ] |
| | | } |
| | | ] |
| | | }; |
| | | |
| | | ngOnInit() { |
| | | const params = JSON.parse(sessionStorage.getItem("queryParams")); |
| | | const params = JSON.parse(sessionStorage.getItem('queryParams')); |
| | | if (!!params) { |
| | | localStorage.removeItem("queryParams"); |
| | | localStorage.removeItem('queryParams'); |
| | | const items = this.items = JSON.parse(params.items); |
| | | const timeType = params.type; |
| | | this.http.get(environment.SERVER_BASH_URL + 'report/compare', {params: params}).subscribe((res: any) => { |
| | |
| | | } else { |
| | | const option = this.echartOption; |
| | | const sensors = res.data.sensors; |
| | | const deviceCounts = res.data.deviceCounts; |
| | | const timeArr = this.timeArr; |
| | | const label = timeArr[this.typeArr.indexOf(timeType)]; |
| | | option.xAxis.data = res.data.times; |
| | |
| | | } |
| | | for (let i = 0; i < items.length; i++) { |
| | | this.title = items[i].formatTime; |
| | | const legendName = items[i].formatTime + label + (items[i].mac ? items[i].deviceName : items[i].monitorPointName); |
| | | items[i].deviceCount = deviceCounts[i]; |
| | | if (!items[i].monitorPointid) { |
| | | items[i].monitorPointName = items[i].areaName; |
| | | } |
| | | const legendName = items[i].formatTime + label + (items[i].mac ? '设备:' + items[i].deviceName : (items[i].monitorPointid ? '监测点:' + items[i].monitorPointName : items[i].areaName)); |
| | | option.legend.data[i] = legendName; |
| | | option.series.push({ |
| | | name: legendName, |
| | | data: res.data.datas[i]['data' + i][0][sensorKey], |
| | | data: res.data.datas[i][sensorKey], |
| | | type: params.reportType, |
| | | smooth: true, |
| | | itemStyle: { |
| | |
| | | for (let i = 0; i < title.length; i++) { |
| | | this.title += title[i] + timeArr[i]; |
| | | } |
| | | if (sensors.length % 2 == 0) { |
| | | this.pieCharOption.backgroundColor = 'rgba(0,0,0,0)'; |
| | | } else { |
| | | this.pieCharOption.backgroundColor = 'rgba(23,133,23,0.06)'; |
| | | } |
| | | // const myChart = echarts.init(document.getElementById('pieChar')); |
| | | // myChart.setOption(this.pieCharOption, true); |
| | | // window.onresize = myChart.resize; |
| | | } |
| | | }); |
| | | |
| | | } else { |
| | | this.msgSrv.error("页面错误,将关闭该页面!"); |
| | | setTimeout("window.close();",1000); |
| | | this.msgSrv.error('页面错误,将关闭该页面!'); |
| | | setTimeout('window.close();', 1000); |
| | | } |
| | | } |
| | | } |