noise/public/javascripts/showcharts.js

import {logerror} from "./logit.js";
import * as utils from "./chart_utilities.js";
import { DateTime } from './luxon.min.js'
import * as map from "./map.js";
import {showError} from "./chart_utilities.js";

// table to distribute the different charts
export const tabtable = [
    {id: 'kartentab', type: 'map', container: 'map', func: map.showMap, div: null, dformat: null},
    {id: 'livetab', type: 'live', container: 'dlive', func: showChart, div: 2, dformat: "dd.LL - HH:mm:ss"},
    {id: 'houravgtab', type: 'havg', container: 'dhour', func: showChart, div: 1, dformat: "dd.LL - HH'h'"},
    {id: 'dayavgtab', type: 'davg', container: 'dday', func: showChart, div: 1, dformat: "dd.LL"},
    {id: 'daynighttab', type: 'daynight', container: 'ddaynight', func: showChart, div: 1, dformat: "dd.LL"},
    {id: 'ldentab', type: 'lden', container: 'dlden', func: showChart, div: 1, dformat: "dd.LL"},
]


export async function showChart(params, typ, container) {
    function form() {
        for (let item of tabtable) {
            if (item.type === typ) {
                const d = DateTime.fromMillis(this.x, {zone: 'utc'})
                const d1 = d.plus({days: 1})
                let fmt = d.toFormat(item.dformat)
                if (((typ === 'daynight') && (this.series.name.startsWith('N'))) || (typ === 'lden')) {
                    fmt = `${d.toFormat('dd')}/${d1.toFormat('dd.LL')}`
                }
                if (this.series.name === 'Peaks') {
                    item.div = 0
                }
                return '<div style="border: 2px solid ' + this.point.color + '; padding: 3px;">' +
                    fmt + '<br />' +
                    '<span style="color: ' + this.point.color + '">&#9679;&nbsp;</span>' +
                    this.series.name + ':&nbsp; <b>' +
                    Highcharts.numberFormat(this.y, item.div) +
                    '</b></div>'
            }
        }
    }

    function xformat() {
        if (typ === 'lden') {
            let lbl = this.axis.defaultLabelFormatter.call(this);
            this.value += 86400000;
            let lbl1 = this.axis.defaultLabelFormatter.call(this);
            return parseInt(lbl) + '/' + lbl1;
        } else if ((typ === 'live') || (typ === 'havg')) {
            let v = this.axis.defaultLabelFormatter.call(this);
            if (v.indexOf(':') == -1) {
                return '<span style="font-weight:bold;color:red">' + v + '<span>';
            } else {
                return v;
            }
        } else {
            return this.axis.defaultLabelFormatter.call(this);
        }
    }

    const url = `/api/getsensordata?sensorid=${params.sid}&data=${typ}&span=${params.span}&datetime=${params.datetime.slice(0,-10)}&peak=${params.peak}`
    let ret = await fetch(url)
        .catch(e => {
            logerror(e)
        });
    let erg = await ret.json()
    if (!erg.err) {
        erg.options.xAxis.labels.formatter = xformat
        erg.options.tooltip.formatter = form
        let chart = Highcharts.chart(container, erg.options, function (chart) {
            utils.addSensorID2chart(chart, {
                sid: erg.params.sensorid,
                indoor: erg.params.indoor
            }, document.getElementById(container).offsetWidth)
            if(erg.info) {
                let wbreit = window.innerWidth
                let cbreit = chart.chartWidth
                let infoposx = wbreit - ((wbreit-cbreit)/2) -200
                let infoposy = chart.plotTop - 80
                chart.renderer.label(
                    erg.info.text,
                    infoposx,
                    infoposy,
                    'rect', 0, 0, true)
                    .css({
                        fontSize: '10pt',
                        color: 'green'
                    })
                    .attr({
                        zIndex: 5,
                    }).add();
            }
        })
        return true
    } else {
        showError(erg.err)
        return false
    }
}

export const loadAll = async (params) => {
    console.log('now load all in Background')
    for (let i = 1; i < tabtable.length; i++) {
        let ok = await showChart(params, tabtable[i].type, tabtable[i].container)
        if (!ok) {
            break;
        }
    }
}