First running version

2023-03-24 13:49:54 +01:00
parent be8d364116
commit d10b274fe0
18 changed files with 1377 additions and 645 deletions
@@ -0,0 +1,129 @@
+// Sh0w the hour average chart
+import {logit, logerror} from './logit.js'
+import * as utils from './chart_utilities.js'
+import {DateTime, Duration} from "./luxon.min.js"
+
+// ******************************************************************
+// PlotHourAVG_Noise
+// ******************************************************************
+
+
+export const showHouravg = async (params) => {
+    await PlotHourAVG_Noise(params.sid)
+}
+
+
+const PlotHourAVG_Noise = async function (sid) {
+
+    let series1 = []
+    let series2 = []
+
+    // read the data from the server
+    const url = `${utils.url}/getsensordata?sensorid=${sid}&data=havg`
+    let ret = await fetch(url)
+        .catch(e => {
+            logerror(e)
+        })
+    let data = await ret.json()
+
+    if(!data.err) {
+
+        // Put values into the serieses
+        let cnt = 0
+        data.values.forEach((x) => {
+            if (x.n_AVG != -1) {
+                let dat = new Date(x.datetime).getTime()	// retrieve the date
+                series1.push([dat, x.n_AVG])
+                series2.push([dat, x.peakcount])
+            }
+        })
+    } else {
+        utils.showError(data.err)
+    }
+    let dlt = DateTime.now()	// retrieve the date
+    dlt = dlt.minus({day:1})
+
+    // Plot-Options
+    let options = utils.createGlobObtions()
+    options.xAxis.tickInterval = 6 * 3600 * 1000
+    options.xAxis.plotBands =  utils.calcWeekends(data, true)
+    options.xAxis.minTickInterval =  3600 * 1000
+
+    options.yAxis = {
+            title: {
+                text: 'dbA',
+                useHTML: true,
+            },
+            min: utils.noise_ymin,
+            tickAmount: 10,
+            gridLineColor: 'lightgray',
+        }
+    options.series =  [
+            {
+                name: 'Mean value LAeq',
+                data: series1,
+                color: utils.colors.eq,
+                type: 'column',
+                zIndex: 2,
+            },
+        ]
+    options.plotOptions.column = {
+                pointWidth: 8,
+                groupPadding: 0.5
+            }
+    options.title.text = 'Noise hourly mean values'
+    options.subtitle.text =  'Hourly mean values of LAeq for each full hour <br />&nbsp'
+    options.subtitle.useHTML = true
+    options.chart.zoomType = 'x'
+    options.chart.height = 350
+    options.chart.resetZoomButton=  {
+        position: {
+            align: 'left',
+//				verticalAlign: 'bottom',
+            x: 20,
+            y: 300,
+        },
+        relativeTo: 'chart'
+    }
+    options.tooltip.formatter =  function () {
+        let y = Math.round(this.y * 10) / 10
+        return '<div style="border: 2px solid ' + this.point.color + '; padding: 3px;">' +
+            DateTime.fromMillis(this.x, {zone: 'utc'}).toFormat("dd.LL - HH'h'") + '<br />' +
+            '<span style="color: ' + this.point.color + '">&#9679;&nbsp;</span>' +
+            this.series.name + ':&nbsp; <b>' + y + '</b></div>'
+    }
+
+
+    // Do PLOT 1
+    let ch = Highcharts.chart('dhour', options, function (chart) {
+        utils.addSensorID2chart(chart, {sid: data.sid, indoor: data.indoor}, document.getElementById('dhour').offsetWidth)
+    })
+    // Do PLOT 2
+    options.series[0] = {
+        name: 'Peaks',
+        data: series2,
+        color: utils.colors.peaks,
+        type: 'column'
+    }
+    options.title.text = 'Peaks more than ' + data.peak + ' dbA'
+    options.subtitle.text = 'Number of exceedances per hour <br />&nbsp'
+    options.yAxis = {
+        title: {
+            text: 'Counts',
+            useHTML: true,
+        },
+        tickAmount: 10,
+        allowDecimals: false,
+        gridLineColor: 'lightgray',
+    }
+    options.tooltip.formatter =  function () {
+        let y = Math.round(this.y)
+        return '<div style="border: 2px solid ' + this.point.color + '; padding: 3px;">' +
+            DateTime.fromMillis(this.x, {zone: 'utc'}).toFormat("dd.LL - HH'h'") + '<br />' +
+            '<span style="color: ' + this.point.color + '">&#9679;&nbsp;</span>' +
+            this.series.name + ':&nbsp; <b>' + y + '</b></div>'
+    }
+
+    let ch1 = Highcharts.chart('dpeak', options)
+}
+