From 1fdd2c6fe276c5d9849c14739eaba37061264eb5 Mon Sep 17 00:00:00 2001 From: fengxiang <110431245@qq.com> Date: Mon, 16 Jul 2018 11:36:33 +0800 Subject: [PATCH] 统计分析 划分独立模块 --- src/app/routes/forecasting-warning/forecasting-warning.component.ts | 123 +++++++++++++++++++++++++++++++++++++++-- 1 files changed, 117 insertions(+), 6 deletions(-) diff --git a/src/app/routes/forecasting-warning/forecasting-warning.component.ts b/src/app/routes/forecasting-warning/forecasting-warning.component.ts index 1955d13..3aa9802 100644 --- a/src/app/routes/forecasting-warning/forecasting-warning.component.ts +++ b/src/app/routes/forecasting-warning/forecasting-warning.component.ts @@ -1,5 +1,10 @@ -import { Component, OnInit } from '@angular/core'; -import { _HttpClient } from '@delon/theme'; +import {environment} from '../../../environments/environment'; +import {HttpClient} from '@angular/common/http'; +import {Component, OnInit} from '@angular/core'; +import {_HttpClient} from '@delon/theme'; +import {zip} from 'rxjs/observable/zip'; +import * as echarts from 'echarts'; +import * as moment from 'moment'; @Component({ selector: 'app-forecasting-warning', @@ -7,11 +12,117 @@ }) export class ForecastingWarningComponent implements OnInit { - constructor( - private http: _HttpClient - ) { } + constructor( + private _http: _HttpClient, + public http: HttpClient + ) { - ngOnInit() { + } + [x: string]: any; + + public option = { + title: { + text: '', + left: 'center' + }, + xAxis: { + type: 'category', + data: [] + }, + yAxis: { + type: 'value', + name: '���������' + }, + series: [{ + data: [], + type: 'line', + smooth: true + }] + }; + PM2_5 = []; PM10 = []; CO = []; NO2 = []; O3 = []; SO2 = []; + title = '������������������'; + + ngOnInit() { + this.initWarning(); + } + + changeType(event) { + if (event === 'warning') { + this.initWarning(); + } else { + this.initForecasting(); } + } + initForecasting() { + // this.http.get('http://sapi.7drlb.com/api/mj?cityID=1102&apiKey=forecast15days').subscribe((res: any) => { + // console.info(res); + // }); + zip( + this.http.get('http://sapi.7drlb.com/api/mj?cityID=1102&apiKey=forecast15days'), + this.http.get('http://sapi.7drlb.com/api/mj?cityID=1102&apiKey=forecast24hours') + ).subscribe( + ([daysRes, hoursRes]) => { + console.info(daysRes); + console.info(hoursRes); + }); + } + + initWarning() { + this.PM2_5 = []; this.PM10 = []; this.CO = []; this.NO2 = []; this.O3 = []; this.SO2 = []; + this.option.xAxis.data = []; + this.http.get(environment.SERVER_BASH_URL + 'demo/list').subscribe((res: any) => { + res.forEach(data => { + const json = JSON.parse(data.aqi_json); + this.PM2_5.push(json.PM2_5); + this.PM10.push(json.PM10); + this.CO.push(json.CO); + this.NO2.push(json.NO2); + this.O3.push(json.O3); + this.SO2.push(json.SO2); + this.option.xAxis.data.push(moment(data.time).format('DD���HH���')); + }); + const warning_PM25Chart = echarts.init(document.getElementById('warning_PM25')); + this.option.series[0].data = this.PM2_5; + this.option.yAxis.name = '���������ug/m��'; + this.option.title.text = this.title + '(PM2.5)'; + warning_PM25Chart.setOption(this.option, false); + window.onresize = warning_PM25Chart.resize; + + const warning_PM10Chart = echarts.init(document.getElementById('warning_PM10')); + this.option.series[0].data = this.PM10; + this.option.yAxis.name = '���������ug/m��'; + this.option.title.text = this.title + '(PM10)'; + warning_PM10Chart.setOption(this.option, false); + window.onresize = warning_PM10Chart.resize; + + const warning_COChart = echarts.init(document.getElementById('warning_CO')); + this.option.series[0].data = this.CO; + this.option.yAxis.name = '���������mg/m��'; + this.option.title.text = this.title + '(CO)'; + warning_COChart.setOption(this.option, false); + window.onresize = warning_COChart.resize; + + const warning_NO2Chart = echarts.init(document.getElementById('warning_NO2')); + this.option.series[0].data = this.NO2; + this.option.yAxis.name = '���������ug/m��'; + this.option.title.text = this.title + '(NO2)'; + warning_NO2Chart.setOption(this.option, false); + window.onresize = warning_NO2Chart.resize; + + const warning_O3Chart = echarts.init(document.getElementById('warning_O3')); + this.option.series[0].data = this.O3; + this.option.yAxis.name = '���������ug/m��'; + this.option.title.text = this.title + '(O3)'; + warning_O3Chart.setOption(this.option, false); + window.onresize = warning_O3Chart.resize; + + const warning_SO2Chart = echarts.init(document.getElementById('warning_SO2')); + this.option.series[0].data = this.SO2; + this.option.yAxis.name = '���������ug/m��'; + this.option.title.text = this.title + '(SO2)'; + warning_SO2Chart.setOption(this.option, false); + window.onresize = warning_SO2Chart.resize; + }); + } } -- Gitblit v1.8.0