diff options
Diffstat (limited to 'ebus/webapp/static')
| -rw-r--r-- | ebus/webapp/static/console.html | 68 | ||||
| -rw-r--r-- | ebus/webapp/static/src/ebus.js | 6 |
2 files changed, 39 insertions, 35 deletions
diff --git a/ebus/webapp/static/console.html b/ebus/webapp/static/console.html index b8b732b..71a861c 100644 --- a/ebus/webapp/static/console.html +++ b/ebus/webapp/static/console.html @@ -36,18 +36,10 @@ "tempkollektorWert" : "heizkreisregler9.solarDaten.tempKollektor", "boilerWert" : "feuerungsautomat1.betriebsdatenRegler1.boilerTemperatur" }; - function timeToString(timestamp) { - var d = new Date(); - return dateToString(d); - } - function dateToString(d) { - var f = d3.format("02d"); - return f(d.getHours()) + ":" + f(d.getMinutes()) + ":" + f(d.getSeconds()); - } - function log(data) { + function process(data) { for (var i in data) { var row = data[i]; - var caption = "[" + timeToString(row.timestamp) + "] " + row.name + " Value: " + row.value_real + " - " + row.value_string; + var caption = "[" + d3.format("02d")(row.timestamp) + "] " + row.name + " Value: " + row.value_real + " - " + row.value_string; d3.select("#log").insert("div", "div").text(caption); @@ -62,19 +54,20 @@ function reload(time_stop) { d3.json("../stream/" + time_stop, function(resp) { - log(resp.data); + process(resp.data); reload(resp.time_stop); }); } d3.xml("draw.svg", "image/svg+xml", function(xml) { - // Put SVG Data into the DOM + // Write SVG Data into the DOM d3.select("#image")[0][0].appendChild(xml.documentElement); + // Create Popup for (var mapping_element_id in mapping) { d3.select("#" + mapping_element_id).on("click", function() { var elem = d3.select( this ); - var sensor_name = mapping[elem.attr("id")]; + var sensor_name = mapping[elem.attr("id")]; var popup = d3.select("body") .append("div") .classed("popup", true) @@ -86,7 +79,7 @@ popup.append("div") .text(sensor_name); - var w = 550, h = 200, margin = 20; + var w = 550, h = 200, margin = 30; var plot = popup.append("svg:svg") .classed("plot", true) .attr("width", w) @@ -108,14 +101,15 @@ y_min = d3.min(data, function(d){return d[1]}), y_max = d3.max(data, function(d){return d[1]}); - var y = d3.scale.linear() - .domain([y_min, y_max]) - .range([0+margin, h-margin]); - var x = d3.time.scale() .domain([x_min, x_max]) .range([0+margin, w-margin]); - + + var y = d3.scale.linear() + .domain([y_min, y_max]) + .range([0+margin, h]); + + var g = plot.append("svg:g") .attr("transform", "translate(0, "+h+")"); @@ -126,21 +120,15 @@ g.append("svg:path") .attr("d", line(data)); - // Axes + // Axes X-Line g.append("svg:line") - .attr("x1", x(x_min)) - .attr("y1", -1 * y(y_min)) + .attr("x1", 0) + .attr("y1", -1*y(y_min)) .attr("x2", x(x_max)) .attr("y2", -1 * y(y_min)); - - g.append("svg:line") - .attr("x1", x(x_min)) - .attr("y1", -1*y(y_min)) - .attr("x2", x(x_min)) - .attr("y2", -1*y(y_max)); - // Ticks + // Tick Labels var tick_format = d3.time.format("%d.%m"); g.selectAll(".xlabel") .data(x.ticks(5)).enter() @@ -158,18 +146,28 @@ .attr("y", function(d) {return -1*y(d)}) .attr("text-anchor", "right"); + // X-Lines + g.selectAll(".xlines") + .data(x.ticks(5)).enter() + .append("svg:line") + .style("fill", "none") + .style("stroke", "#000000") + .style("stroke-width", 0.5) + .style("stroke-dasharray", "6,1") + .attr("x1", function(d){return x(d)}) + .attr("y1", -1*y(y_min)+(margin/2)) + .attr("x2", function(d){return x(d)}) + .attr("y2", -1*y(y_max)); + + // wait_indicator.remove(); }); }); } d3.json("../all_values", function(resp) { - log(resp.data); - - d3.json("../stream", function(resp) { - log(resp.data); - reload(resp.time_stop); - }); + process(resp.data); + reload(resp.time_stop); }); }); </script> diff --git a/ebus/webapp/static/src/ebus.js b/ebus/webapp/static/src/ebus.js index ba14f51..46a9ed8 100644 --- a/ebus/webapp/static/src/ebus.js +++ b/ebus/webapp/static/src/ebus.js @@ -66,10 +66,15 @@ $(document).ready(function(){ unplotSensorDetail(sensorname); unplotSensorOverview(sensorname); }; + var tzFix = function(d) { + return d - new Date().getTimezoneOffset() * 60 * 1000; + } + var plotSensorDetail = function(sensorConfig) { $.getJSON("sensor/"+escape(sensorConfig.sensorname)+"/"+from+"/"+to, function(response) { if (response['data']) { + response.data = response.data.map(function(d) { return [ tzFix(d[0]), d[1] ]; }); datasetDetail.push({'data':response['data'], 'label':sensorConfig.sensorname, 'color':sensorConfig.color}); @@ -94,6 +99,7 @@ $(document).ready(function(){ $.getJSON("sensor_cached/"+escape(sensorConfig.sensorname)+"/"+fromOverview, //+"/"+to, function(response) { if (response['data']) { + response.data = response.data.map(function(d) { return [ tzFix(d[0]), d[1] ]; }); datasetOverview.push({'data':response['data'], 'label':sensorConfig.sensorname, 'color':sensorConfig.color}); |