7a15817936
index.pug - removed #dpeak1/#dpeak2 showcharts.js - removed second chart public/stylesheets/style.sass - removed #dpeak1/2 - ste height für char divs
80 lines
3.2 KiB
JavaScript
80 lines
3.2 KiB
JavaScript
import {logerror} from "./logit.js";
|
|
import * as utils from "./chart_utilities.js";
|
|
import { DateTime } from './luxon.min.js'
|
|
import * as map from "./map.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 + '">● </span>' +
|
|
this.series.name + ': <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 = `/chart/getsensordata?sensorid=${params.sid}&data=${typ}`
|
|
let ret = await fetch(url)
|
|
.catch(e => {
|
|
logerror(e)
|
|
});
|
|
let erg = await ret.json()
|
|
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)
|
|
})
|
|
}
|
|
|
|
export const loadAll = async (params) => {
|
|
console.log('now load all in Background')
|
|
for (let i = 2; i < tabtable.length; i++) {
|
|
await showChart(params, tabtable[i].type, tabtable[i].container)
|
|
}
|
|
}
|