//defaults var default_granularity = '5m'; // needs to be specified as string, changes var default_hours = 24; // int is OK, (h) hardcoded var default_end = 0; // detto var base_url = "https://bastart.spoton.cz/data/"; var counter = 0; var tout = 5000; // fresh date refresh rate, in ms var g_tout = 30000; // graph update rate, in ms //initialize the uninitialized var hours = new Object(); var granularity = new Object(); var end = new Object(); var graphdata = new Object(); var data = new Object(); // types match function names in python's Dynamic.py class var types = Array('wind_monitor', 'temphumi_monitor', 'pressure_monitor', 'rrate_monitor'); // Now let's set up the defaults and primary data sources, leter changed dynamically var types_size = types.length; for(var i=0; iSpeed / Gusts [km/h]', y2label: 'Direction [°]', labelsDiv: 'wind_labels', legend: 'always' } ); temphumi_out = new Dygraph( document.getElementById("temphumi"), data['temphumi_monitor'], { axes : { x : { drawGrid: true, drawAxis : true }, y : { drawGrid: false, drawAxis : true, valueRange: [10,35] }, y2 : { drawGrid: false, drawAxis: true, independentTicks: true, valueRange: [0,100] } }, rollPeriod: 5, visibility: [true, true], interactionModel: {}, connectSeparatedPoints: true, series:{ 'T(out)': { axis: 'y', color: '#705555', fillGraph: true, fillAlpha: 0.2 }, 'Humi(out)': { axis: 'y2', color: '#222288' } }, ylabel: 'Inside [°C]', y2label: 'Humidity [%]', labelsDiv: 'temphumi_labels_in', legend: 'always' } ); /* pressure = new Dygraph( document.getElementById("pressure"), data['pressure_monitor'], { axes : { x : { drawGrid: true, drawAxis : true }, y : { drawGrid: false, drawAxis : true, valueRange: [970,1055] }, y2 : { drawGrid: false, drawAxis: true, valueRange: [970,1055] } }, rollPeriod: 20, interactionModel: {}, connectSeparatedPoints: true, visibility: [true, false], series:{ 'Pressure': { axis: 'y', color: '#557070', fillGraph: true, fillAlpha: 0.5 }, 'Pressure': { axis: 'y2', color: '#557070', fillGraph: true, fillAlpha: 0.5 } }, ylabel: 'Pressure [hPa]', labelsDiv: 'pressure_labels', legend: 'always' } );*/ rrate = new Dygraph( document.getElementById("rrate"), data['rrate_monitor'], { axes : { x : { drawGrid: true, drawAxis : true }, y : { drawGrid: false, drawAxis : true, valueRange: [0,3] }, y2 : { drawGrid: false, drawAxis: true, valueRange: [0,3] } }, rollPeriod: 0, interactionModel: {}, connectSeparatedPoints: true, visibility: [true, true], series:{ 'Rrate': { axis: 'y', color: '#0055ff', fillGraph: true, fillAlpha: 0.5 }, 'Rrate_max': { axis: 'y2', color: '#0000aa', fillGraph: false } }, ylabel: 'Rain rate [mm/h]', labelsDiv: 'rrate_labels', legend: 'always' } ); // Functions for buttons to scale / move graphs function refreshGraph(source){ graphdata[source] = "https://bastart.spoton.cz/data/" + source + "?range=" + hours[source] + "h&granularity=" + granularity[source] + "&end=" + end[source] + "h"; if(source == 'wind_monitor'){ wind.updateOptions({'file': graphdata[source]}); } if(source == 'temphumi_monitor'){ temphumi_out.updateOptions({'file': graphdata[source]}); temphumi_in.updateOptions({'file': graphdata[source]}); } if(source == 'pressure_monitor'){ pressure.updateOptions({'file': graphdata[source]}); } if(source == 'rrate_monitor'){ rrate.updateOptions({'file': graphdata[source]}); } // TODO: adjust to update graph timestamps per click on ranges // document.getElementById('g_tstamp_' + source).innerHTML = freshVals.time; } // here, target needs to match the python's dynamic class again function setHours(hours_to_set, target){ hours[target] = hours_to_set; switch(hours[target]){ case '1': granularity[target] = '30s'; if(target == 'temphumi_monitor'){ granularity[target] = '2m';} break; case '6': granularity[target] = '1m'; if(target == 'temphumi_monitor'){ granularity[target] = '2m';} break; case '12': granularity[target] = '2m'; if(target == 'temphumi_monitor'){ granularity[target] = '2m';} break; case '24': granularity[target] = '5m'; if(target == 'temphumi_monitor'){ granularity[target] = '2m';} break; case '168': granularity[target] = '10m'; break; case '720': granularity[target] = '1h'; break; case '4320': granularity[target] = '12h'; break; case '8640': granularity[target] = '24h'; break; default: granularity[target] = default_granularity; } end[target] = 0; refreshGraph(target); } // Functions for buttons to scale / move graphs function setBack(target){ disp_range = hours[target]*1 - end[target]*1; hours[target] = hours[target]*1 + disp_range; end[target] = end[target]*1 + disp_range; refreshGraph(target); } function setForth(target){ disp_range = hours[target]*1 - end[target]*1; hours[target] = hours[target]*1 - disp_range; if(hours[target] < disp_range){ hours[target] = disp_range; } end[target] = end[target]*1 - disp_range; if(end[target] < 0){ end[target] = 0; } refreshGraph(target); } function getPageContents(callback,url,params) { if (window.XMLHttpRequest){ // code for IE7+, Firefox, Chrome, Opera, Safari, SeaMonkey xmlhttp=new XMLHttpRequest(); } else{ // code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } if(params!=null) { xmlhttp.open("POST", url, true); xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); } else { xmlhttp.open("GET", url, true); } xmlhttp.onreadystatechange = function() { if(xmlhttp.readyState == 4 && xmlhttp.status == 200) { callback(xmlhttp.responseText); } } xmlhttp.send(params); } function refreshValues(){ fresh_vals_url = '/data/weather_realtime_data?type=json' getPageContents(function(result){freshVals=JSON.parse(result);}, fresh_vals_url) document.getElementById('timestamp').innerHTML = freshVals.time; document.getElementById('w_speed_km').innerHTML = freshVals.wind.speed; document.getElementById('w_speed_ms').innerHTML = freshVals.wind.speed_ms; document.getElementById('w_dir').innerHTML = freshVals.wind.dir; document.getElementById('w_gust_km').innerHTML = freshVals.wind.gust; document.getElementById('w_gust_ms').innerHTML = freshVals.wind.gust_ms; document.getElementById('w_dir_name').innerHTML = freshVals.wind.dir_name; document.getElementById('out_temp').innerHTML = freshVals.temperature.out; document.getElementById('in_temp').innerHTML = freshVals.temperature.in; document.getElementById('current_pressure').innerHTML = freshVals.pressure; document.getElementById('current_rrate').innerHTML = freshVals.rainrate; counter = counter + tout; if(counter >= g_tout){ for(var i=0; i