From 4150625e122fc47f3a4d2adfbe0e2f861dd35b8e Mon Sep 17 00:00:00 2001
From: xufenglei <xufenglei>
Date: Mon, 16 Jul 2018 16:48:29 +0800
Subject: [PATCH] 更新
---
src/app/routes/forecasting-warning/forecasting-warning.component.ts | 86 +++++++++++++++++++++++++++----------------
1 files changed, 54 insertions(+), 32 deletions(-)
diff --git a/src/app/routes/forecasting-warning/forecasting-warning.component.ts b/src/app/routes/forecasting-warning/forecasting-warning.component.ts
index 80765ba..d9cfe0c 100644
--- a/src/app/routes/forecasting-warning/forecasting-warning.component.ts
+++ b/src/app/routes/forecasting-warning/forecasting-warning.component.ts
@@ -21,7 +21,7 @@
[x: string]: any;
public isShow = true;
-
+ colors = ['#c23531', '#2f4554', '#61a0a8', '#d48265', '#91c7ae', '#749f83', '#ca8622', '#bda29a', '#6e7074', '#546570', '#c4ccd3'];
public option = {
title: {
text: '',
@@ -46,7 +46,13 @@
data: [],
type: 'line',
smooth: true,
- name: ''
+ name: '',
+ itemStyle: {
+ color: ''
+ },
+ areaStyle: {
+ normal: {}
+ }
}
]
};
@@ -88,30 +94,33 @@
}
});
const forecasting_tempChart = echarts.init(document.getElementById('forecasting_temp'));
- this.option.series[0].data = temp;
- this.option.yAxis.name = '������������';
this.option.title.text = title + '(������)';
- forecasting_tempChart.setOption(this.option, false);
+ this.option.yAxis.name = '������������';
+ this.option.series[0].data = temp;
+ this.option.series[0].itemStyle.color = this.colors[0];
forecasting_tempChart.setOption(this.option, false);
window.onresize = forecasting_tempChart.resize;
const forecasting_humidityChart = echarts.init(document.getElementById('forecasting_humidity'));
- this.option.series[0].data = humidity;
- this.option.yAxis.name = '���������%';
this.option.title.text = title + '(������)';
+ this.option.yAxis.name = '���������%';
+ this.option.series[0].data = humidity;
+ this.option.series[0].itemStyle.color = this.colors[1];
forecasting_humidityChart.setOption(this.option, false);
window.onresize = forecasting_humidityChart.resize;
const forecasting_pressureChart = echarts.init(document.getElementById('forecasting_pressure'));
- this.option.series[0].data = pressure;
- this.option.yAxis.name = '���������hPa';
this.option.title.text = title + '(������)';
+ this.option.yAxis.name = '���������hPa';
+ this.option.series[0].data = pressure;
+ this.option.series[0].itemStyle.color = this.colors[2];
forecasting_pressureChart.setOption(this.option, false);
window.onresize = forecasting_pressureChart.resize;
const forecasting_uviChart = echarts.init(document.getElementById('forecasting_uvi'));
- this.option.series[0].data = uvi;
- this.option.yAxis.name = '���������';
this.option.title.text = title + '(���������)';
+ this.option.yAxis.name = '���������';
+ this.option.series[0].data = uvi;
+ this.option.series[0].itemStyle.color = this.colors[3];
forecasting_uviChart.setOption(this.option, false);
window.onresize = forecasting_uviChart.resize;
@@ -127,20 +136,27 @@
}
});
const forecasting_temp_dayChart = echarts.init(document.getElementById('forecasting_temp_day'));
+ this.option.title.text = '���������������(������)';
+ this.option.yAxis.name = '������������';
+ this.option['legend'] = {
+ right: '10%',
+ data: ['������������', '������������']
+ };
+ this.option.series[0].data = temp_day;
+ this.option.series[0].name = '������������';
+ this.option.series[0].itemStyle.color = this.colors[4];
this.option.series[1] = {
data: temp_night,
type: 'line',
smooth: true,
- name: '������������'
+ name: '������������',
+ areaStyle: {
+ normal: {}
+ },
+ itemStyle: {
+ color: this.colors[6]
+ }
};
- this.option.series[0].data = temp_day;
- this.option.series[0].name = '������������';
- this.option.yAxis.name = '������������';
- this.option.title.text = '���������������(������)';
- this.option['legend'] = {
- right: '10%',
- data: ['������������', '������������']
- },
forecasting_temp_dayChart.setOption(this.option, false);
window.onresize = forecasting_temp_dayChart.resize;
});
@@ -165,44 +181,50 @@
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 = PM2_5;
- this.option.yAxis.name = '���������ug/m��';
this.option.title.text = title + '(PM2.5)';
+ this.option.yAxis.name = '���������ug/m��';
+ this.option.series[0].data = PM2_5;
+ this.option.series[0].itemStyle.color = this.colors[0];
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 = PM10;
- this.option.yAxis.name = '���������ug/m��';
this.option.title.text = title + '(PM10)';
+ this.option.yAxis.name = '���������ug/m��';
+ this.option.series[0].data = PM10;
+ this.option.series[0].itemStyle.color = this.colors[1];
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 = CO;
- this.option.yAxis.name = '���������mg/m��';
this.option.title.text = title + '(CO)';
+ this.option.yAxis.name = '���������mg/m��';
+ this.option.series[0].data = CO;
+ this.option.series[0].itemStyle.color = this.colors[2];
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 = NO2;
- this.option.yAxis.name = '���������ug/m��';
this.option.title.text = title + '(NO2)';
+ this.option.yAxis.name = '���������ug/m��';
+ this.option.series[0].data = NO2;
+ this.option.series[0].itemStyle.color = this.colors[3];
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 = O3;
- this.option.yAxis.name = '���������ug/m��';
this.option.title.text = title + '(O3)';
+ this.option.yAxis.name = '���������ug/m��';
+ this.option.series[0].data = O3;
+ this.option.series[0].itemStyle.color = this.colors[4];
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 = SO2;
- this.option.yAxis.name = '���������ug/m��';
this.option.title.text = title + '(SO2)';
+ this.option.yAxis.name = '���������ug/m��';
+ this.option.series[0].data = SO2;
+ this.option.series[0].itemStyle.color = this.colors[6];
warning_SO2Chart.setOption(this.option, false);
window.onresize = warning_SO2Chart.resize;
});
--
Gitblit v1.8.0