diff --git a/public/javascripts/chart_utilities.js b/public/javascripts/chart_utilities.js
index 08732a5..f7d2712 100644
--- a/public/javascripts/chart_utilities.js
+++ b/public/javascripts/chart_utilities.js
@@ -24,6 +24,9 @@ export function createGlobObtions() {
// Options, die für alle Plots identisch sind
let globObject = {
chart: {
+ accessibility: {
+ enabled: false
+ },
height: 600,
// width: 1000,
spacingRight: 20,
@@ -160,7 +163,7 @@ export function calcDays(data, isyear) {
export async function addSensorID2chart(chart, sensor, width) {
console.log('widht: ',width);
- let indoor =sensor.indoor
+ let indoor = sensor.indoor || false
console.log('indoor: ',indoor)
let sens = chart.renderer.label(
`Sensor: ${sensor.sid} ${indoor ? ' (indoor)' : ''}`,
@@ -179,4 +182,15 @@ export const showError = (err) => {
document.querySelector('.modal-body').setHTML(err)
let myModal = new bootstrap.Modal(document.getElementById('dialogError'))
myModal.show()
-}
\ No newline at end of file
+}
+
+// remove the taps (if shownig the map)
+export const removeTabs = () => {
+ document.querySelector('#navi').style.display = 'none'
+}
+
+// show thw tabs again
+export const showTabs = () => {
+ document.querySelector('#navi').style.display = 'block'
+}
+
diff --git a/public/javascripts/global.js b/public/javascripts/global.js
index e575d7b..4c44a3c 100644
--- a/public/javascripts/global.js
+++ b/public/javascripts/global.js
@@ -10,7 +10,7 @@ import * as chart_dayavg from './chart_dayavg.js'
import * as chart_daynight from './chart_daynight.js'
import * as chart_lden from './chart_lden.js'
import * as utils from "./chart_utilities.js";
-import {tabtable} from './showcharts.js'
+import { tabtable, loadAll } from './showcharts.js'
(async () => {
@@ -22,29 +22,19 @@ import {tabtable} from './showcharts.js'
// global variables
let params = { // set defaults
- drawlines: false,
- nbrentries: 0,
- device: '',
- coordinates: false,
center: Stuttgart,
zoom: 10,
refresh: 0,
starttime: '2023-01-01T00:00:00Z', //date2ISO(defaultStartime),
endtime: '2023-03-01T00:00:00Z' //date2ISO(emptyTimes.emptyHMtime)
}
+
+ let status = {
+ loaded: false
+ }
// END global variables
- // remove the taps (if shownig the map)
- const removeTabs = () => {
- document.querySelector('#navi').style.display = 'none'
- }
-
- // show thw tabs again
- const showTabs = () => {
- document.querySelector('#navi').style.display = 'block'
- }
-
// main function:
// show the map if calle w/o any parameter
// if called with a sensor-ID, show the live chart for this sensor
@@ -57,12 +47,14 @@ import {tabtable} from './showcharts.js'
triggerEl.addEventListener('click', function (event) {
event.preventDefault()
tabTrigger.show()
- for(let x of tabtable) {
- if (x.id === event.currentTarget.id) {
- x.func(params, x.type, x.container)
+ if((!status.loaded) || (this.id === 'kartentab')) {
+ for (let x of tabtable) {
+ if (x.id === event.currentTarget.id) {
+ x.func(params, x.type, x.container)
+ }
}
+ logit(`tab changed to ${event.currentTarget.id}`)
}
- logit(`tab chaned to ${event.currentTarget.id}`)
})
})
@@ -80,10 +72,11 @@ import {tabtable} from './showcharts.js'
params.sid = csid
await chart_live.showLive(params)
}
+
// show the map
- removeTabs()
- map.showMap(params)
+ map.showMap(params, status)
}
+
main().catch(console.error)
})()
\ No newline at end of file
diff --git a/public/javascripts/map.js b/public/javascripts/map.js
index f5e22b6..1c00797 100644
--- a/public/javascripts/map.js
+++ b/public/javascripts/map.js
@@ -3,19 +3,25 @@
import * as dt from './datetime.js'
import * as chart_live from "./chart_live.js"
import * as utils from "./chart_utilities.js"
-import { showChart } from './showcharts.js'
+import { showChart, loadAll } from './showcharts.js'
let map = null
let bounds
let popuptext = ''
let clickedSensor = 0
+let clickedcoords = {}
const colorscale = ['#d53e4f', '#fc8d59', '#fee08b', '#e6f598', '#99d594', '#3288bd', '#808080'];
const dba = [100, 80, 60, 40, 20, 0, -999];
-export async function showMap(params) {
- if (map) return
- map = L.map('map',{ scrollWheelZoom: false}).setView(params.center, parseInt(params.zoom))
+export async function showMap(params, status) {
+ utils.removeTabs()
+
+ if(map && map.remove) {
+ map.off();
+ map.remove();
+ }
+ map = L.map('map', {scrollWheelZoom: false}).setView(params.center, parseInt(params.zoom))
L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
maxZoom: 19,
attribution: '© OpenStreetMap'
@@ -54,6 +60,11 @@ export async function showMap(params) {
let triggerEl = document.querySelector('#livetab')
bootstrap.Tab.getInstance(triggerEl).show() // Select tab by name
await showChart(params, 'live', 'dlive')
+ loadAll(params)
+ status.loaded = true
+ map.setView([clickedcoords.lat, clickedcoords.lng]);
+
+
})
})
@@ -209,6 +220,7 @@ export async function buildMarkers() {
async function onMarkerClick(e, click) {
let item = e.target.options;
clickedSensor = item.name;
+ clickedcoords = e.latlng
let offlinetext = `
| offline |
@@ -255,32 +267,6 @@ async function setCenter(adr) {
// Show the last date below tha map grafics
async function showLastDate(ld) {
- // const url = `http://localhost:3004/getproperties?type=noise&box=${bounds.toBBoxString()}`
- //
- // let ret = await fetch(url)
- // .catch(e => {
- // console.log(e)
- // });
- // let sensors = await ret.json()
- //
- // let url = '/api/getdata';
- // let ld = moment(dt);
- // let last = ld.subtract(1,'h')
- // let erg;
- // let allsens
- // try {
- // erg = await $.getJSON(url + `?data=props&last=1900-01-01`);
- // allsens = erg.count
- // erg = await $.getJSON(url + `?data=props&last=${last.format('YYYY-MM-DD HH:mm')}`);
- // if ((erg != undefined) && (erg.values[0].error != undefined)) {
- // showError(3,erg.values[0].error,aktsensorid);
- // return;
- // }
- // }
- // catch(e) {
- // console.log(e)
- // }
- // fetch all sensors
const url = `/chart/getmapdata?type=noise`
let ret = await fetch(url)
.catch(e => {
diff --git a/public/javascripts/showcharts.js b/public/javascripts/showcharts.js
index 2c7ce21..9967852 100644
--- a/public/javascripts/showcharts.js
+++ b/public/javascripts/showcharts.js
@@ -55,17 +55,15 @@ export async function showChart(params, typ, container) {
}
}
-
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 chr = Highcharts.chart(container, erg.options, function (chart) {
+ let chart = Highcharts.chart(container, erg.options, function (chart) {
utils.addSensorID2chart(chart, {
sid: erg.params.sensorid,
indoor: erg.params.indoor
@@ -79,4 +77,9 @@ export async function showChart(params, typ, container) {
}
}
-
+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)
+ }
+}
diff --git a/public/stylesheets/style.sass b/public/stylesheets/style.sass
index 9d17aa9..10fe4c4 100644
--- a/public/stylesheets/style.sass
+++ b/public/stylesheets/style.sass
@@ -161,4 +161,5 @@ footer
border: red solid 2px
.highcharts-tooltip
- zIndex: 5
\ No newline at end of file
+ zIndex: 5
+
diff --git a/views/layout.pug b/views/layout.pug
index 4fe7c8f..c3df28d 100644
--- a/views/layout.pug
+++ b/views/layout.pug
@@ -46,4 +46,5 @@ html
crossorigin="")
script(src="/javascripts/leaflet.markercluster.js")
script(src="https://code.highcharts.com/highcharts.js")
+ script(src="https://code.highcharts.com/modules/accessibility.js")
script(type="module" src="/javascripts/global.js")
\ No newline at end of file