From b39f748c221a8dea481c5daa99fe20c94bfd8adb Mon Sep 17 00:00:00 2001 From: Chris Kaczor Date: Sun, 10 Nov 2019 10:40:56 -0500 Subject: [PATCH] Change rain charting --- Display/package-lock.json | 27 ++++++++++++------- .../charts/weather-charts.component.ts | 26 ++++++++---------- 2 files changed, 28 insertions(+), 25 deletions(-) diff --git a/Display/package-lock.json b/Display/package-lock.json index 62d57be..fb5db2d 100644 --- a/Display/package-lock.json +++ b/Display/package-lock.json @@ -5323,9 +5323,9 @@ "dev": true }, "handlebars": { - "version": "4.3.4", - "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.3.4.tgz", - "integrity": "sha512-vvpo6mpK4ScNC1DbGRZ2d5BznS6ht0r1hi20RivsibMc6jNvFAeZQ6qk5VNspo6SOwVOJQbjHyBCpuS7BzA1pw==", + "version": "4.5.1", + "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.5.1.tgz", + "integrity": "sha512-C29UoFzHe9yM61lOsIlCE5/mQVGrnIOrOq7maQl76L7tYPCgC1og0Ajt6uWnX4ZTxBPnjw+CUvawphwCfJgUnA==", "dev": true, "requires": { "neo-async": "^2.6.0", @@ -5624,9 +5624,9 @@ "dev": true }, "https-proxy-agent": { - "version": "2.2.2", - "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-2.2.2.tgz", - "integrity": "sha512-c8Ndjc9Bkpfx/vCJueCPy0jlP4ccCCSNDp8xwCZzPjKJUm+B+u9WX2x98Qx4n1PiMNTWo3D7KK5ifNV/yJyRzg==", + "version": "2.2.4", + "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-2.2.4.tgz", + "integrity": "sha512-OmvfoQ53WLjtA9HeYP9RNrWMJzzAz1JGaSFr1nijg0PVR1JaD/xbJq1mdEIIlxGpXp9eSe/O2LgU9DJmTPd0Eg==", "dev": true, "requires": { "agent-base": "^4.3.0", @@ -11188,16 +11188,23 @@ "dev": true }, "uglify-js": { - "version": "3.6.0", - "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.6.0.tgz", - "integrity": "sha512-W+jrUHJr3DXKhrsS7NUVxn3zqMOFn0hL/Ei6v0anCIMoKC93TjcflTagwIHLW7SfMFfiQuktQyFVCFHGUE0+yg==", + "version": "3.6.8", + "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.6.8.tgz", + "integrity": "sha512-XhHJ3S3ZyMwP8kY1Gkugqx3CJh2C3O0y8NPiSxtm1tyD/pktLAkFZsFGpuNfTZddKDQ/bbDBLAd2YyA1pbi8HQ==", "dev": true, "optional": true, "requires": { - "commander": "~2.20.0", + "commander": "~2.20.3", "source-map": "~0.6.1" }, "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": { "version": "0.6.1", "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz", diff --git a/Display/src/app/components/weather/charts/weather-charts.component.ts b/Display/src/app/components/weather/charts/weather-charts.component.ts index 2918813..dee972f 100644 --- a/Display/src/app/components/weather/charts/weather-charts.component.ts +++ b/Display/src/app/components/weather/charts/weather-charts.component.ts @@ -1,6 +1,6 @@ import { Component, OnInit } from '@angular/core'; import { Chart } from 'angular-highcharts'; -import { SeriesLineOptions, SeriesWindbarbOptions } from 'highcharts'; +import { SeriesLineOptions, SeriesWindbarbOptions, SeriesColumnOptions } from 'highcharts'; import { HttpClient } from '@angular/common/http'; import { WeatherReadingGrouped } from '../../../models/weather/weather-reading-grouped'; import { WindHistoryGrouped } from '../../../models/weather/wind-history-grouped'; @@ -103,18 +103,16 @@ export class WeatherChartsComponent implements OnInit { const startString = start.toISOString(); const endString = end.toISOString(); - const request = this.httpClient.get(`/api/weather/readings/history-grouped?start=${startString}&end=${endString}&bucketMinutes=5`); + const request = this.httpClient.get(`/api/weather/readings/history-grouped?start=${startString}&end=${endString}&bucketMinutes=30`); request.subscribe(data => { - const seriesData: Array = []; + const seriesData: Array = []; - seriesData.push({ 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({ 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({ name: 'Rain', data: [], yAxis: 3, marker: { enabled: false }, tooltip: { valueSuffix: '"' } } as SeriesLineOptions); - - let rainTotal = 0; + seriesData.push({ type: 'line', name: 'Temperature', data: [], yAxis: 0, marker: { enabled: false }, tooltip: { valueSuffix: '°F' } } as SeriesLineOptions); + seriesData.push({ type: 'line', name: 'Pressure', data: [], yAxis: 1, 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({ type: 'line', name: 'Light', data: [], yAxis: 2, marker: { enabled: false }, tooltip: { valueSuffix: '%' } } as SeriesLineOptions); + seriesData.push({ type: 'column', name: 'Rain', data: [], yAxis: 3, marker: { enabled: false }, tooltip: { valueSuffix: '"' } } as SeriesColumnOptions); data.forEach(dataElement => { 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[2].data.push([date, dataElement.averageHumidity]); seriesData[3].data.push([date, dataElement.averageLightLevel * 100]); - - rainTotal += dataElement.rainTotal; - - seriesData[4].data.push([date, rainTotal]); + seriesData[4].data.push([date, dataElement.rainTotal]); }); const title = this.selectedTimeSpan === TimeSpan.Last24Hours ? this.timeSpanItems[TimeSpan.Last24Hours] : this.getSelectedDateDisplayString(); this.chart = new Chart({ chart: { - type: 'line', zoomType: 'x' }, title: { @@ -190,6 +184,8 @@ export class WeatherChartsComponent implements OnInit { title: { text: 'Rain' }, + min: 0, + max: 0.25, visible: true, opposite: true }