Revize 72effbbe

Re #8774 - Implementovat pracovní verzi grafů pro jednotku

• moved graph loading to separate class
• change range for line charts

src/app/sensor/components/sensor.component.ts

@@ -4 +4 @@
 import * as moment from 'moment-timezone';
 import {AnalyticsService} from '../../shared/api/endpoints/services/analytics.service';
 import {AggreationModel} from '../../shared/models/aggreation.model';
+import {GraphLoader} from "../../shared/graph-loading/graphloader";
 
 declare var require: any
 
@@ -42 +43 @@
   }
 
 
-  getGraph(sensorId, data, interval) {
+  /*getGraph(sensorId, data, interval) {
     let spec = this.getGraphType(sensorId);
     const vega = require('vega');
     const vegaTooltip = require('vega-tooltip');
@@ -54 +55 @@
 
     let handler = new vegaTooltip.Handler();
 
-    /*const view = new vega.View(vega.parse(spec), {
-      renderer: 'canvas',
-      container: '#view',
-      hover: 'true'}).runAsync();*/
-
     const loc = vega.locale({
       "decimal": ",",
       "thousands": "\u00a0",
@@ -114 +110 @@
     }
 
 
-  }
+  }*/
 
   showGraph() {
     let agg = 'HOUR';
@@ -150 +146 @@
       to: moment(range[1]).format('yyyy-MM-DD HH:mm:ssZ').slice(0, -3), interval: agg}).subscribe(
       observations => {
         if (observations){
-          this.getGraph(this.sensorId, observations[this.sensorId].data, observations[this.sensorId].interval);
+          GraphLoader.getGraph(this.sensorId, observations[this.sensorId].data, observations[this.sensorId].interval, "view");
         } else {
           //TODO observace null
         }

src/app/shared/graph-loading/graphloader.ts

@@ +1 @@
+declare var require: any
+
+export class GraphLoader {
+
+
+  static getGraphType(sensorId) {
+    const lodash = require('lodash/object');
+
+    if (sensorId >= 480000000 && sensorId < 490000000) {
+
+      let rvalue: any = {};
+      let base = require('/src/vega/base/default.json');
+      let chart = require('/src/vega/body/barchart.json');
+      let tooltip = require('/src/vega/tooltip/samm-tooltip.json')
+      lodash.merge(rvalue, base, chart, tooltip);
+      return rvalue;
+
+    } else if ((sensorId >= 470020000 && sensorId < 470030000) || (sensorId >= 470060000 && sensorId < 470090000) ||
+      (sensorId >= 470130000 && sensorId < 470140000) || (sensorId >= 470180000 && sensorId < 470190000)) {
+
+      let rvalue: any = {};
+      let base = require('/src/vega/base/default.json');
+      let chart = require('/src/vega/body/windchart.json');
+      let tooltip = require('/src/vega/tooltip/samm-tooltip.json')
+      lodash.merge(rvalue, base, chart, tooltip);
+      return rvalue;
+
+    } else {
+
+      let rvalue: any = {};
+      let base = require('/src/vega/base/default.json');
+      let chart = require('/src/vega/body/linechart.json');
+      let tooltip = require('/src/vega/tooltip/samm-tooltip.json')
+      lodash.merge(rvalue, base, chart, tooltip);
+      return rvalue;
+
+    }
+  }
+
+  static getGraph(sensorId, data, interval, element) {
+    let spec = this.getGraphType(sensorId);
+    const vega = require('vega');
+    const vegaTooltip = require('vega-tooltip');
+    const config = require('/src/vega/config.json');
+
+    spec.data[0].values = data;
+    spec.signals[0].value = interval;
+
+
+    let handler = new vegaTooltip.Handler();
+
+    const loc = vega.locale({
+      "decimal": ",",
+      "thousands": "\u00a0",
+      "grouping": [3],
+      "currency": ["", "\u00a0Kč"]
+    },{
+      "dateTime": "%A,%e.%B %Y, %X",
+      "date": "%-d.%-m.%Y",
+      "time": "%H:%M:%S",
+      "periods": ["AM", "PM"],
+      "days": ["neděle", "pondělí", "úterý", "středa", "čvrtek", "pátek", "sobota"],
+      "shortDays": ["ne.", "po.", "út.", "st.", "čt.", "pá.", "so."],
+      "months": ["leden", "únor", "březen", "duben", "květen", "červen", "červenec", "srpen", "září", "říjen", "listopad", "prosinec"],
+      "shortMonths": ["led", "úno", "břez", "dub", "kvě", "čer", "červ", "srp", "zář", "říj", "list", "pros"]
+    });
+
+    let view = new vega.View(vega.parse(spec, config))
+      .tooltip(handler.call)
+      .initialize(element)
+      .hover()
+      .locale(loc)
+      .runAsync();
+
+
+
+  }
+
+}

src/app/unit/components/unit.component.ts

@@ -5 +5 @@
 import {Sensors} from '../../shared/api/endpoints/models/sensors';
 import {AggreationModel} from '../../shared/models/aggreation.model';
 import * as moment from 'moment-timezone';
+import {GraphLoader} from "../../shared/graph-loading/graphloader";
 
 declare var require: any
 
@@ -66 +67 @@
         //console.log(this.data);
         var objectKeys = Object.keys(data);
         for(const key of objectKeys ) {
-          this.getGraph(key, data[key]["data"], data[key]["interval"]);
+          let element = this.createView();
+          GraphLoader.getGraph(key, data[key]["data"], data[key]["interval"], element);
+
         }
       })
     ).subscribe();
   }
 
-  getGraph(sensorId, data, interval) {
+ /* getGraph(sensorId, data, interval) {
     let spec = this.getGraphType(sensorId);
     let elementName = this.createView();
     const vega = require('vega');
@@ -147 +150 @@
     }
 
 
-  }
+  }*/
 
   createView() {
     let div = document.createElement("div");

src/vega/base/default.json

@@ -49 +49 @@
         },
         {
           "type": "formula",
-          "expr": "datum[\"dateMinTemp\"] * 1.05",
+          "expr": "datum[\"maxValueTemp\"] * 1.05",
           "as": "valueMax"
         }
       ]

src/vega/body/linechart.json

@@ -37 +37 @@
           "name": "yDetail",
           "type": "linear",
           "range": [390, 0],
-          "domain": {"data": "table", "field": "value"},
+          "domain": {"data": "range", "field": "valueMax"},
           "nice": true, "zero": true
         }
       ],