mirror of
https://github.com/ckaczor/HomeMonitor.git
synced 2026-02-16 10:58:32 -05:00
Change rain charting
This commit is contained in:
27
Display/package-lock.json
generated
27
Display/package-lock.json
generated
@@ -5323,9 +5323,9 @@
|
|||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"handlebars": {
|
"handlebars": {
|
||||||
"version": "4.3.4",
|
"version": "4.5.1",
|
||||||
"resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.3.4.tgz",
|
"resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.5.1.tgz",
|
||||||
"integrity": "sha512-vvpo6mpK4ScNC1DbGRZ2d5BznS6ht0r1hi20RivsibMc6jNvFAeZQ6qk5VNspo6SOwVOJQbjHyBCpuS7BzA1pw==",
|
"integrity": "sha512-C29UoFzHe9yM61lOsIlCE5/mQVGrnIOrOq7maQl76L7tYPCgC1og0Ajt6uWnX4ZTxBPnjw+CUvawphwCfJgUnA==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"neo-async": "^2.6.0",
|
"neo-async": "^2.6.0",
|
||||||
@@ -5624,9 +5624,9 @@
|
|||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"https-proxy-agent": {
|
"https-proxy-agent": {
|
||||||
"version": "2.2.2",
|
"version": "2.2.4",
|
||||||
"resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-2.2.2.tgz",
|
"resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-2.2.4.tgz",
|
||||||
"integrity": "sha512-c8Ndjc9Bkpfx/vCJueCPy0jlP4ccCCSNDp8xwCZzPjKJUm+B+u9WX2x98Qx4n1PiMNTWo3D7KK5ifNV/yJyRzg==",
|
"integrity": "sha512-OmvfoQ53WLjtA9HeYP9RNrWMJzzAz1JGaSFr1nijg0PVR1JaD/xbJq1mdEIIlxGpXp9eSe/O2LgU9DJmTPd0Eg==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"agent-base": "^4.3.0",
|
"agent-base": "^4.3.0",
|
||||||
@@ -11188,16 +11188,23 @@
|
|||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"uglify-js": {
|
"uglify-js": {
|
||||||
"version": "3.6.0",
|
"version": "3.6.8",
|
||||||
"resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.6.0.tgz",
|
"resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.6.8.tgz",
|
||||||
"integrity": "sha512-W+jrUHJr3DXKhrsS7NUVxn3zqMOFn0hL/Ei6v0anCIMoKC93TjcflTagwIHLW7SfMFfiQuktQyFVCFHGUE0+yg==",
|
"integrity": "sha512-XhHJ3S3ZyMwP8kY1Gkugqx3CJh2C3O0y8NPiSxtm1tyD/pktLAkFZsFGpuNfTZddKDQ/bbDBLAd2YyA1pbi8HQ==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"optional": true,
|
"optional": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"commander": "~2.20.0",
|
"commander": "~2.20.3",
|
||||||
"source-map": "~0.6.1"
|
"source-map": "~0.6.1"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
"commander": {
|
||||||
|
"version": "2.20.3",
|
||||||
|
"resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
|
||||||
|
"integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
"source-map": {
|
"source-map": {
|
||||||
"version": "0.6.1",
|
"version": "0.6.1",
|
||||||
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
|
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
import { Component, OnInit } from '@angular/core';
|
import { Component, OnInit } from '@angular/core';
|
||||||
import { Chart } from 'angular-highcharts';
|
import { Chart } from 'angular-highcharts';
|
||||||
import { SeriesLineOptions, SeriesWindbarbOptions } from 'highcharts';
|
import { SeriesLineOptions, SeriesWindbarbOptions, SeriesColumnOptions } from 'highcharts';
|
||||||
import { HttpClient } from '@angular/common/http';
|
import { HttpClient } from '@angular/common/http';
|
||||||
import { WeatherReadingGrouped } from '../../../models/weather/weather-reading-grouped';
|
import { WeatherReadingGrouped } from '../../../models/weather/weather-reading-grouped';
|
||||||
import { WindHistoryGrouped } from '../../../models/weather/wind-history-grouped';
|
import { WindHistoryGrouped } from '../../../models/weather/wind-history-grouped';
|
||||||
@@ -103,18 +103,16 @@ export class WeatherChartsComponent implements OnInit {
|
|||||||
const startString = start.toISOString();
|
const startString = start.toISOString();
|
||||||
const endString = end.toISOString();
|
const endString = end.toISOString();
|
||||||
|
|
||||||
const request = this.httpClient.get<WeatherReadingGrouped[]>(`/api/weather/readings/history-grouped?start=${startString}&end=${endString}&bucketMinutes=5`);
|
const request = this.httpClient.get<WeatherReadingGrouped[]>(`/api/weather/readings/history-grouped?start=${startString}&end=${endString}&bucketMinutes=30`);
|
||||||
|
|
||||||
request.subscribe(data => {
|
request.subscribe(data => {
|
||||||
const seriesData: Array<SeriesLineOptions> = [];
|
const seriesData: Array<SeriesLineOptions | SeriesColumnOptions> = [];
|
||||||
|
|
||||||
seriesData.push({ name: 'Temperature', data: [], yAxis: 0, marker: { enabled: false }, tooltip: { valueSuffix: '°F' } } as SeriesLineOptions);
|
seriesData.push({ type: 'line', name: 'Temperature', data: [], yAxis: 0, marker: { enabled: false }, tooltip: { valueSuffix: '°F' } } as SeriesLineOptions);
|
||||||
seriesData.push({ name: 'Pressure', data: [], yAxis: 1, marker: { enabled: false }, tooltip: { valueSuffix: '"' } } as SeriesLineOptions);
|
seriesData.push({ type: 'line', name: 'Pressure', data: [], yAxis: 1, marker: { enabled: false }, tooltip: { valueSuffix: '"' } } as SeriesLineOptions);
|
||||||
seriesData.push({ name: 'Humidity', data: [], yAxis: 2, marker: { enabled: false }, tooltip: { valueSuffix: '%' } } as SeriesLineOptions);
|
seriesData.push({ type: 'line', name: 'Humidity', data: [], yAxis: 2, marker: { enabled: false }, tooltip: { valueSuffix: '%' } } as SeriesLineOptions);
|
||||||
seriesData.push({ name: 'Light', data: [], yAxis: 2, marker: { enabled: false }, tooltip: { valueSuffix: '%' } } as SeriesLineOptions);
|
seriesData.push({ type: 'line', name: 'Light', data: [], yAxis: 2, marker: { enabled: false }, tooltip: { valueSuffix: '%' } } as SeriesLineOptions);
|
||||||
seriesData.push({ name: 'Rain', data: [], yAxis: 3, marker: { enabled: false }, tooltip: { valueSuffix: '"' } } as SeriesLineOptions);
|
seriesData.push({ type: 'column', name: 'Rain', data: [], yAxis: 3, marker: { enabled: false }, tooltip: { valueSuffix: '"' } } as SeriesColumnOptions);
|
||||||
|
|
||||||
let rainTotal = 0;
|
|
||||||
|
|
||||||
data.forEach(dataElement => {
|
data.forEach(dataElement => {
|
||||||
const date = Date.parse(dataElement.bucket);
|
const date = Date.parse(dataElement.bucket);
|
||||||
@@ -122,17 +120,13 @@ export class WeatherChartsComponent implements OnInit {
|
|||||||
seriesData[1].data.push([date, dataElement.averagePressure / 33.864 / 100]);
|
seriesData[1].data.push([date, dataElement.averagePressure / 33.864 / 100]);
|
||||||
seriesData[2].data.push([date, dataElement.averageHumidity]);
|
seriesData[2].data.push([date, dataElement.averageHumidity]);
|
||||||
seriesData[3].data.push([date, dataElement.averageLightLevel * 100]);
|
seriesData[3].data.push([date, dataElement.averageLightLevel * 100]);
|
||||||
|
seriesData[4].data.push([date, dataElement.rainTotal]);
|
||||||
rainTotal += dataElement.rainTotal;
|
|
||||||
|
|
||||||
seriesData[4].data.push([date, rainTotal]);
|
|
||||||
});
|
});
|
||||||
|
|
||||||
const title = this.selectedTimeSpan === TimeSpan.Last24Hours ? this.timeSpanItems[TimeSpan.Last24Hours] : this.getSelectedDateDisplayString();
|
const title = this.selectedTimeSpan === TimeSpan.Last24Hours ? this.timeSpanItems[TimeSpan.Last24Hours] : this.getSelectedDateDisplayString();
|
||||||
|
|
||||||
this.chart = new Chart({
|
this.chart = new Chart({
|
||||||
chart: {
|
chart: {
|
||||||
type: 'line',
|
|
||||||
zoomType: 'x'
|
zoomType: 'x'
|
||||||
},
|
},
|
||||||
title: {
|
title: {
|
||||||
@@ -190,6 +184,8 @@ export class WeatherChartsComponent implements OnInit {
|
|||||||
title: {
|
title: {
|
||||||
text: 'Rain'
|
text: 'Rain'
|
||||||
},
|
},
|
||||||
|
min: 0,
|
||||||
|
max: 0.25,
|
||||||
visible: true,
|
visible: true,
|
||||||
opposite: true
|
opposite: true
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user