diff options
Diffstat (limited to 'datastore-leveldb/wwwroot_ebus/src')
-rw-r--r-- | datastore-leveldb/wwwroot_ebus/src/d3.control.js | 120 | ||||
-rw-r--r-- | datastore-leveldb/wwwroot_ebus/src/d3.plot.js | 99 | ||||
-rw-r--r-- | datastore-leveldb/wwwroot_ebus/src/ebus.js | 291 |
3 files changed, 0 insertions, 510 deletions
diff --git a/datastore-leveldb/wwwroot_ebus/src/d3.control.js b/datastore-leveldb/wwwroot_ebus/src/d3.control.js deleted file mode 100644 index 489edea..0000000 --- a/datastore-leveldb/wwwroot_ebus/src/d3.control.js +++ /dev/null @@ -1,120 +0,0 @@ -var d3_control = function(element, svgurl, mapping) { - this.mapping = mapping; - this.element = element; - var control = this; - d3.xml(svgurl, "image/svg+xml", function(xml) { - element[0][0].appendChild(xml.documentElement); - element.select("svg") - .style("width","100%").style("height", "100%"); - - // Setup mapping - for (var element_id in this.mapping) { - control.initElement(element_id); - } - d3.json("../all_values", function(response) { - control.process(response.data); - control.reload(response.time_stop); - }); - }); -}; - -d3_control.prototype = { - initElement:function(element_id) { - var options = this.mapping[element_id]; - d3.select(document.getElementById(element_id)) - .on("mouseover", - function() { - if( typeof(options._plot) == "undefined") { - options._plot = d3.select(this.ownerSVGElement) - .append("svg:g") - .classed("d3.control_popup", true); - - var startdate = (new Date().getTime()/1000) - 7*60*60*24; - var enddate = (new Date().getTime()/1000); - var plot = d3.plot(options._plot); - d3.json("../sensor/"+options.sensor+"/" + startdate + "/" + enddate, - function(resp) { - var data = resp.data.map(function(d) { - return [new Date(d[0]), d[1]]; - }); - plot.draw(data); - }); - - options._plot.on("mouseout", - function() { - if (options._plot.node().contains(d3.event.relatedTarget)) - return; - options._plot - .transition() - .duration(1000) - .style("opacity", 0.0) - .remove(); - }); - - var drag = d3.behavior.drag() - .on("dragstart", function() { - options._plot.on("mouseout", null); - options._plot.transition().duration(1000).style("opacity", 1.0); - - delete options._plot; - d3.select(this).select("rect") - .style("stroke", "gray") - .style("stroke-width", "3px"); - }) - .on("drag", function(d,i){ - d=[]; - d.x = d3.event.x; - d.y = d3.event.y; - d3.select(this).attr("transform", "translate("+d.x+","+d.y+")"); - }) - .on("dragend", function() { - d3.select(this).on("mousedown.drag", null); - d3.select(this).on("click", function() { d3.select(this).remove(); }); - }); - - options._plot.call(drag); - } else { - this.ownerSVGElement - .appendChild(options._plot.node()); - - options._plot.style("opacity", 1); - } - - var xy = d3.svg.mouse(this.ownerSVGElement); - options._plot.attr("transform", "translate("+xy[0]+","+xy[1]+")"); - }); - }, - process:function(data) { - for (var i in data) { - var row = data[i]; - - if (typeof(console) != "undefined") { - console.log("[" + d3.format("02d")(row.timestamp) + "] " + - row.name + " Value: " + row.value_real + " - " + - row.value_string); - } - - for (var element_id in this.mapping) { - var options = this.mapping[element_id]; - if (row.name == options.sensor){ - d3.select(document.getElementById(element_id)) - .text(""+row.value_real); - } - } - } - }, - reload:function(time_stop) { - var url = "../stream"; - if (time_stop != null) - url += "/" + time_stop; - var control = this; - d3.json(url, function(response) { - control.process(response.data); - control.reload(response.time_stop); - }); - } -}; - -d3.control = function(element, svgurl, mapping) { - return new d3_control(element,svgurl,mapping); -}; diff --git a/datastore-leveldb/wwwroot_ebus/src/d3.plot.js b/datastore-leveldb/wwwroot_ebus/src/d3.plot.js deleted file mode 100644 index d9a7d04..0000000 --- a/datastore-leveldb/wwwroot_ebus/src/d3.plot.js +++ /dev/null @@ -1,99 +0,0 @@ -(function(){ - -function d3_plot(container) { - this.opt = { - w:550, h:200, margin:30 - }; - this.element = container.append("svg:g") - .classed("d3.plot_plot",true) - .attr("width", this.opt.w) - .attr("height", this.opt.h); - - this.element.append("svg:rect") - .attr("width", this.opt.w) - .attr("height", this.opt.h) - .style("fill", "white"); - - this.element.append("svg:text") - .classed("d3-plot_wait", true) - .attr("x", this.opt.w/2) - .attr("y", this.opt.h/2) - .attr("text-anchor", "center") - .text("Bitte warten"); -}; - -d3_plot.prototype = { - draw: function(data) { - var x_min = d3.min(data, function(d){return d[0];}), - x_max = d3.max(data, function(d){return d[0];}), - y_min = d3.min(data, function(d){return d[1];}), - y_max = d3.max(data, function(d){return d[1];}); - - var x = d3.time.scale() - .domain([x_min, x_max]) - .range([0+this.opt.margin, this.opt.w-this.opt.margin]); - - var y = d3.scale.linear() - .domain([y_min, y_max]) - .range([0+this.opt.margin, this.opt.h-(this.opt.margin/2)]); - - - var g = this.element.append("svg:g") - .attr("transform", "translate(0, "+this.opt.h+")"); - - var line = d3.svg.line() - .x(function(d,i){ return x(d[0]); }) - .y(function(d) {return -1*y(d[1]);}); - - g.append("svg:path") - .attr("d", line(data)); - - // Axes X-Line - g.append("svg:line") - .attr("x1", 0) - .attr("y1", -1*y(y_min)) - .attr("x2", x(x_max)) - .attr("y2", -1 * y(y_min)); - - - // Tick Labels - var tick_format = d3.time.format("%d.%m"); - g.selectAll(".xlabel") - .data(x.ticks(5)).enter() - .append("svg:text") - .text(function(d){return tick_format(d);}) - .attr("x", function(d) {return x(d);}) - .attr("y", -5) - .attr("text-anchor", "center"); - - g.selectAll(".ylabel") - .data(y.ticks(5)).enter() - .append("svg:text") - .text(String) - .attr("x", 0) - .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)+(this.opt.margin/3)) - .attr("x2", function(d){return x(d);}) - .attr("y2", -1*y(y_max)); - - // - this.element.select(".d3-plot_wait").style("display","none"); - } -}; - -d3.plot = function(container) { - return new d3_plot(container); -}; - -})();
\ No newline at end of file diff --git a/datastore-leveldb/wwwroot_ebus/src/ebus.js b/datastore-leveldb/wwwroot_ebus/src/ebus.js deleted file mode 100644 index 862e24d..0000000 --- a/datastore-leveldb/wwwroot_ebus/src/ebus.js +++ /dev/null @@ -1,291 +0,0 @@ -// vim: set filetype=javascript expandtab tabstop=4 shiftwidth=4 autoindent smartindent: -var d = new Object(); -d.ms = 1; -d.sec = 1000*d.ms; -d.min = 60 * d.sec; -d.hour = 60 * d.min; -d.day = 24 * d.hour; -d.week = 7 * d.day; -d.month = 30.5 * d.day; -d.now = new Date().getTime(); - -var timeToUTC = function(d) { return d + new Date().getTimezoneOffset() * 60 * 1000; } -var timeToLocal = function(d) { return d - new Date().getTimezoneOffset() * 60 * 1000; } - -$(document).ready(function(){ - var from = d.now - 2*d.day; - var to = d.now; - var fromOverview = d.now - 1.5 * d.month; - var toOverview = d.now; - var numberOfValues = jQuery("#ebusgraph").width(); - - var datasetDetail = []; - var datasetOverview = []; - - var plotOverview = null; - var plotDetail = null; - var indexFound = null; - var sensorConfigList = [ -{ - "name":"heizkreisregler10.betriebsdatenRegler1.kesselTemperatur", - "description":"Kessel Temperatur", - "values":Math.ceil(jQuery("#ebusgraph").width()/8), - "lines":{fill: true, fillColor: "rgba(80,40,100, 0.1)"}, - "show":true, - "color":"rgb(80,40,100)" -}, -{ - "name":"heizkreisregler9.solarDaten.tempKollektor", - "description":"Kollektortemperatur", - "lines":{fill: true, fillColor: "rgba(255, 0, 0, 0.4)"}, - "values":Math.ceil(jQuery("#ebusgraph").width()/1), - "show":true, - "color":"#f30000" -}, -{ - "name":"heizkreisregler9.solarDaten.tempWarmwasserSolar", - "description":"Warmwasser Solar", - "lines":{fill: true, fillColor: "rgba(30,250,20,0.05)"}, - "values":Math.ceil(jQuery("#ebusgraph").width()/8), - "show":true, - "color":"rgba(30,250,20,0.5)" -}, -{ - "name":"feuerungsautomat1.betriebsdatenRegler1.aussenTemperatur", - "description":"Aussentemperatur (ebus)", - "values":Math.ceil(jQuery("#ebusgraph").width()/4), - "show":true, - "lines":{fill: true, fillColor: "rgba(250, 250, 0, 0.2)"}, - "color":"rgb(250,250,0)" -}, -{ - "name":"dockstar.load5", - "description":"System Load (5m, *10)", - "lines":{lineWidth:1}, - "show":false, - "color":"blue", - "mapFunc":function(d){return [d[0],d[1]*10]} -}, -{ - "name":"dockstar.fs.ROOT", - "description":"Rootfs free percent", - "values":Math.ceil(jQuery("#ebusgraph").width()/16), - "show":false, - "color":"red" -}, -{ - "name":"heizkreisregler10.betriebsdatenRegler1.boilerTemperatur", - "description":"Boilertemperatur", - "values":Math.ceil(jQuery("#ebusgraph").width()/8), - "show":false, - "color":"#48b4ff" -}, -{ - "name":"de.wettermichel.temperature", - "description":"Aussentemperatur (wettermichel)", - "show":false, - "values":Math.ceil(jQuery("#ebusgraph").width()/16), - "lines":{fill: true, fillColor: "rgba(132, 181, 0, 0.2)"}, - "color":"#84b500" -}, - ]; - -var pickSensorConfig = function(sensorname) { - var sensorConfigFound; - $.each(sensorConfigList, function(i,sensorConfig) { - if (sensorConfig["name"] == sensorname) { - sensorConfigFound = sensorConfig; - return false; - } - }); - return sensorConfigFound; -} -var replot = function() { - plotDetail.setData(datasetDetail); - plotDetail.getOptions().xaxes[0].min = timeToLocal(from); - plotDetail.getOptions().xaxes[0].max = timeToLocal(to); - plotDetail.setupGrid(); - plotDetail.draw(); -}; -var replotOverview = function() { - plotOverview.setData(datasetOverview); - plotOverview.setSelection({xaxis: {"from": timeToLocal(from), "to": timeToLocal(to)}}, true); - plotOverview.setupGrid(); - plotOverview.draw(); -}; -var plotSensor = function(sensorConfig) { - plotSensorDetail(sensorConfig); - plotSensorOverview(sensorConfig); -}; -var unplotSensor = function(sensorname) { - unplotSensorDetail(sensorname); - unplotSensorOverview(sensorname); -}; -var plotSensorDetail = function(sensorConfig) { - jQuery("#ebusgraph").animate({opacity:0.2}, 200); - var values = sensorConfig.values || numberOfValues; - $.getJSON("/api/range/"+escape(sensorConfig["name"])+"/"+from+"/"+to+"/" + values, - function(response) { - if (!response.error) { - response.data = response.data.map(function(d) { - return [ timeToLocal(d[0]), d[1] ]; - }); - if (sensorConfig.mapFunc) { - response.data = response.data.map( sensorConfig.mapFunc ) - } - datasetDetail.push({"data":response["data"], - "userData":sensorConfig["name"], - "lines":sensorConfig.lines || {}, - "label":sensorConfig.description, - "color":sensorConfig.color}); - - jQuery("#ebusgraph").animate({opacity:1.0}, 200); - replot(); - } else { - jQuery("#ebusgraph").animate({backgroundColor: "lightRed"},200); - alert("Fehler: " + response["error"]); - } - }).fail(function(a) { - jQuery("#ebusgraph").animate({backgroundColor: "lightRed"},200); - }); -}; - -var unplotSensorDetail = function(sensorname) { - $.each(datasetDetail, function(i, sensor) { - if (sensor["userData"] == sensorname) { - datasetDetail.splice(i,1); - replot(); - return false; - } - }); -}; - -var plotSensorOverview = function(sensorConfig) { - var values = sensorConfig.values || Math.ceil(numberOfValues/2); - $.getJSON("api/range/"+escape(sensorConfig["name"])+"/"+fromOverview+"/"+toOverview+ "/" + values, - function(response) { - if (!response.error) { - response.data = response.data.map(function(d) { - return [ timeToLocal(d[0]), d[1] ]; - }); - if (sensorConfig.mapFunc) { - response.data = response.data.map( sensorConfig.mapFunc) - } - datasetOverview.push({"data":response["data"], - "userData":sensorConfig["name"], - "label":sensorConfig["name"], - "color":sensorConfig.color}); - replotOverview(); - } else { - alert("Overview Fehler: " + response["error"]); - } - }); - -}; -var unplotSensorOverview = function(sensorname) { - $.each(datasetOverview, function(i, sensor) { - if (sensor["userData"] == sensorname) { - datasetOverview.splice(i,1); - replotOverview(); - return false; - } - }); -} - - -plotDetail = $.plot($("#ebusgraph"), - datasetDetail, - { - xaxis: { - mode: "time", - min: timeToLocal(from), - max:timeToLocal(to), - panRange: [timeToLocal(fromOverview), timeToLocal(toOverview)] - }, - yaxis: { min: -16, max: 100, panRange: [-16,100] }, - pan: { - interactive: true, - frameRate: 16, - cursor:"move" - }, - legend: { show : true} - }); -$("#ebusgraph").bind('plotpan', function (event, plot) { - var axes = plot.getAxes(); - plotOverview.setSelection({xaxis: {"from": Math.round(axes.xaxis.min), "to": Math.round(axes.xaxis.max)}}, true); - if (plot.getPlaceholder().css('cursor') == "move") - return; - // On drag end: - update_range(Math.round(axes.xaxis.min), Math.round(axes.xaxis.max)); -}); - -plotOverview = $.plot($("#overview"), - datasetOverview, - { // options - series: { - lines: { show: true, lineWidth: 1 }, - shadowSize: 0 - }, - xaxis: { mode: "time", min: timeToLocal(fromOverview), max:timeToLocal(toOverview)}, - yaxis: { ticks: [], min: -26, max: 100, autoscaleMargin: 0.1 }, - legend: { show: false }, - selection: { mode: "x" } - }); - -function update_range(range_from, range_to) { - if (timeToUTC(range_to) == to && timeToUTC(range_from) == from) { - return; - } - // max selection range - if (range_to - range_from > d.month) { - // reset selection - plotOverview.setSelection({xaxis: {"from": from, "to": to}}, true); - return; - } else { - from = timeToUTC(range_from); - to = timeToUTC(range_to); - } - sensors = []; - for (elem in datasetOverview) { - sensor = datasetDetail[elem]["userData"]; - sensors.push(sensor); - } - datasetDetail =[]; - for (i in sensors) { - plotSensorDetail(pickSensorConfig(sensors[i])); - } -} - -$("#overview").bind("plotselected", function (event, ranges) { - var range_from = Math.round(ranges.xaxis.from); - var range_to = Math.round(ranges.xaxis.to); - update_range(range_from, range_to); -}); - -$.each(sensorConfigList, function(i,sensorConfig) { - var pickerDiv = $("<div>").addClass("picker").appendTo("#sensorpicker"); - var pickerCheckbox = $("<input>").attr("type","checkbox").appendTo(pickerDiv); - pickerCheckbox.data("name", sensorConfig["name"]); - - $("<span>").text( sensorConfig.description + " (" + sensorConfig.sensorname + ")").appendTo(pickerDiv); - - if (sensorConfig.show) { - //Plot - plotSensor(sensorConfig); - $(pickerCheckbox).attr("checked","checked"); - } -}); -// TODO http://people.iola.dk/olau/flot/examples/annotating.html - - -$(".picker input").click( function() { - var sensorname = $(this).data("name"); - if ($(this).is(":checked")) { - if (typeof console != "undefined") console.log(sensorname); - plotSensor(pickSensorConfig(sensorname)); - } else { - unplotSensor(sensorname); - } -}); - -}); |