Visualisierung mit Node Red erstellen

[Damrak2022]

@mickym Ich habe das jetzt in der Influx Node so konfiguriert, das ich im Debug die korrekten Werte erhalte:

Allerdings muss ich gestehen das ich irgendwie keine Ahnung habe, wie ich jetzt weitermachen muss um die Daten in der Chart Node im Liniendiagramm darzustellen.

[mickym]

@damrak2022 Na ich habs Dir ja gepostet. Du kannst ja mal alles was aus der Debug Node rauskommt hier in Code-Tags einstellen. Dann kann mit den Daten über eine Inject Node selbst bissi rumprobieren. Aber ich mach das je nachdem, wie ich lustig bin, also brauchst erst mal nicht drauf zu warten.

[Damrak2022]

@mickym Das ist die Debug Ausgabe:

array[12]
[0 … 9]
0: object
result: "_result"
table: 0
_start: "2023-01-19T00:35:58.94679632Z"
_stop: "2023-01-26T00:35:58.94679632Z"
_time: "2023-01-23T05:50:55.302Z"
_value: 84
_field: "value"
_measurement: "Diastole"
1: object
result: "_result"
table: 0
_start: "2023-01-19T00:35:58.94679632Z"
_stop: "2023-01-26T00:35:58.94679632Z"
_time: "2023-01-23T06:07:26.39Z"
_value: 78
_field: "value"
_measurement: "Diastole"
2: object
result: "_result"
table: 0
_start: "2023-01-19T00:35:58.94679632Z"
_stop: "2023-01-26T00:35:58.94679632Z"
_time: "2023-01-24T07:07:26.438Z"
_value: 78
_field: "value"
_measurement: "Diastole"
3: object
result: "_result"
table: 0
_start: "2023-01-19T00:35:58.94679632Z"
_stop: "2023-01-26T00:35:58.94679632Z"
_time: "2023-01-24T07:22:26.52Z"
_value: 71
_field: "value"
_measurement: "Diastole"
4: object
result: "_result"
table: 1
_start: "2023-01-19T00:35:58.94679632Z"
_stop: "2023-01-26T00:35:58.94679632Z"
_time: "2023-01-23T05:51:28.093Z"
_value: 114
_field: "value"
_measurement: "Puls"
5: object
result: "_result"
table: 1
_start: "2023-01-19T00:35:58.94679632Z"
_stop: "2023-01-26T00:35:58.94679632Z"
_time: "2023-01-23T06:07:26.392Z"
_value: 106
_field: "value"
_measurement: "Puls"
6: object
result: "_result"
table: 1
_start: "2023-01-19T00:35:58.94679632Z"
_stop: "2023-01-26T00:35:58.94679632Z"
_time: "2023-01-24T07:07:26.442Z"
_value: 106
_field: "value"
_measurement: "Puls"
7: object
result: "_result"
table: 1
_start: "2023-01-19T00:35:58.94679632Z"
_stop: "2023-01-26T00:35:58.94679632Z"
_time: "2023-01-24T07:22:26.521Z"
_value: 85
_field: "value"
_measurement: "Puls"
8: object
result: "_result"
table: 2
_start: "2023-01-19T00:35:58.94679632Z"
_stop: "2023-01-26T00:35:58.94679632Z"
_time: "2023-01-23T05:50:25.342Z"
_value: 127
_field: "value"
_measurement: "Systole"
9: object
result: "_result"
table: 2
_start: "2023-01-19T00:35:58.94679632Z"
_stop: "2023-01-26T00:35:58.94679632Z"
_time: "2023-01-23T06:07:26.39Z"
_value: 114
_field: "value"
_measurement: "Systole"
[10 … 11]
10: object
result: "_result"
table: 2
_start: "2023-01-19T00:35:58.94679632Z"
_stop: "2023-01-26T00:35:58.94679632Z"
_time: "2023-01-24T07:07:26.439Z"
_value: 114
_field: "value"
_measurement: "Systole"
11: object
result: "_result"
table: 2
_start: "2023-01-19T00:35:58.94679632Z"
_stop: "2023-01-26T00:35:58.94679632Z"
_time: "2023-01-24T07:22:26.521Z"
_value: 107
_field: "value"
_measurement: "Systole"

[mickym]

@damrak2022 Nein nicht so. Den Wert sauber aus dem Debug Fenster kopieren - nicht mit der Maus. Das solltest Du eigentlich wissen - wie soll ich das denn bitte in eine Inject Node bringen - das ist doch kein Objekt und kein Array.

[Damrak2022]

@mickym Meinst Du so?

payload[10]._value

Das ist die Systole

[mickym]

@damrak2022 Nein Du sollst den Wert aus dem Debug-Fenster kopieren, der aus der Debug Node rauskommt - aber ganz oben, wie man das sauber macht mit "Wert kopieren".

Ich hab das Gefühl - wir fangen wieder bei NULL an.

[Damrak2022]

@mickym

{"result":"_result","table":0,"_start":"2023-01-19T00:35:58.94679632Z","_stop":"2023-01-26T00:35:58.94679632Z","_time":"2023-01-23T05:50:55.302Z","_value":84,"_field":"value","_measurement":"Diastole"}

Sorry, stehe gerade völlig auf dem Schlauch.

[mickym]

@damrak2022 Das ist doch nur ein Objekt - aber schon besser.

Du kannst doch mit der Maus ganz oben den Wert kopieren, sodass das ganze Array enthalten ist.

Also direkt mit der Maus in die Zeile wo array[12] stehen und den Wert kopieren. Ich dachte eigentlich, dass Du das weißt, wie man in dem Debug Fenster Pfade und Werte kopierst.

[Damrak2022]

@mickym

[{"result":"_result","table":0,"_start":"2023-01-19T00:35:58.94679632Z","_stop":"2023-01-26T00:35:58.94679632Z","_time":"2023-01-23T05:50:55.302Z","_value":84,"_field":"value","_measurement":"Diastole"},{"result":"_result","table":0,"_start":"2023-01-19T00:35:58.94679632Z","_stop":"2023-01-26T00:35:58.94679632Z","_time":"2023-01-23T06:07:26.39Z","_value":78,"_field":"value","_measurement":"Diastole"},{"result":"_result","table":0,"_start":"2023-01-19T00:35:58.94679632Z","_stop":"2023-01-26T00:35:58.94679632Z","_time":"2023-01-24T07:07:26.438Z","_value":78,"_field":"value","_measurement":"Diastole"},{"result":"_result","table":0,"_start":"2023-01-19T00:35:58.94679632Z","_stop":"2023-01-26T00:35:58.94679632Z","_time":"2023-01-24T07:22:26.52Z","_value":71,"_field":"value","_measurement":"Diastole"},{"result":"_result","table":1,"_start":"2023-01-19T00:35:58.94679632Z","_stop":"2023-01-26T00:35:58.94679632Z","_time":"2023-01-23T05:51:28.093Z","_value":114,"_field":"value","_measurement":"Puls"},{"result":"_result","table":1,"_start":"2023-01-19T00:35:58.94679632Z","_stop":"2023-01-26T00:35:58.94679632Z","_time":"2023-01-23T06:07:26.392Z","_value":106,"_field":"value","_measurement":"Puls"},{"result":"_result","table":1,"_start":"2023-01-19T00:35:58.94679632Z","_stop":"2023-01-26T00:35:58.94679632Z","_time":"2023-01-24T07:07:26.442Z","_value":106,"_field":"value","_measurement":"Puls"},{"result":"_result","table":1,"_start":"2023-01-19T00:35:58.94679632Z","_stop":"2023-01-26T00:35:58.94679632Z","_time":"2023-01-24T07:22:26.521Z","_value":85,"_field":"value","_measurement":"Puls"},{"result":"_result","table":2,"_start":"2023-01-19T00:35:58.94679632Z","_stop":"2023-01-26T00:35:58.94679632Z","_time":"2023-01-23T05:50:25.342Z","_value":127,"_field":"value","_measurement":"Systole"},{"result":"_result","table":2,"_start":"2023-01-19T00:35:58.94679632Z","_stop":"2023-01-26T00:35:58.94679632Z","_time":"2023-01-23T06:07:26.39Z","_value":114,"_field":"value","_measurement":"Systole"},{"result":"_result","table":2,"_start":"2023-01-19T00:35:58.94679632Z","_stop":"2023-01-26T00:35:58.94679632Z","_time":"2023-01-24T07:07:26.439Z","_value":114,"_field":"value","_measurement":"Systole"},{"result":"_result","table":2,"_start":"2023-01-19T00:35:58.94679632Z","_stop":"2023-01-26T00:35:58.94679632Z","_time":"2023-01-24T07:22:26.521Z","_value":107,"_field":"value","_measurement":"Systole"}]

[mickym]

@damrak2022 Sehr gut!

Nun kann ich mit den gleichen Daten selbst rumprobieren:

So was sollte aber inzwischen selbstverständlich sein. - Also Danke!

[mickym]

@damrak2022 So ich habs fertig - grundsätzlich gilt, dass das Auslesen der Daten aus der Influx DB nur zum Initialisieren des Charts dient - weitere Werte lässt Du direkt in die Chart Node wandern.

Also die DB Abfrage nur einmal machen - wenn der Flow neu gestartet wird.

Löschen kann man die Chart Node in dem man ihr wie in der ersten Node ein leeres Array übergibt.

Sprich die Inject Nodes mit Diastole etc. da müssen dann direkt die Datenpunkte über die iobroker IN Node davor und Du musst das topic setzen wie in den Inject-Nodes vorgegeben.

Die Influx-DB Abfrage machst Du nur einmal beim Neustart des NodeRed Adapters - also einfach einmalig mit einer Inject Node die Query machen und dann in die von mir erstelle Change Node verbinden.

Und wenn Du das JSONATA so gut verstehst, was ich da drin gemacht habe - dann können wir solche Aufgaben machen. Aber da muss ich selbst rumprobieren und ich glaube, dass Du da noch so weit entfernt bist (Lichtjahre ), dass wir uns da entsprechend austauschen könnten.

Spoiler

[
   {
       "id": "e79f1c62ef97b36a",
       "type": "inject",
       "z": "1983aa28392732ca",
       "name": "Influx DB Abfrage zur Initialisierung",
       "props": [
           {
               "p": "payload"
           }
       ],
       "repeat": "",
       "crontab": "",
       "once": false,
       "onceDelay": 0.1,
       "topic": "",
       "payload": "[{\"result\":\"_result\",\"table\":0,\"_start\":\"2023-01-19T00:35:58.94679632Z\",\"_stop\":\"2023-01-26T00:35:58.94679632Z\",\"_time\":\"2023-01-23T05:50:55.302Z\",\"_value\":84,\"_field\":\"value\",\"_measurement\":\"Diastole\"},{\"result\":\"_result\",\"table\":0,\"_start\":\"2023-01-19T00:35:58.94679632Z\",\"_stop\":\"2023-01-26T00:35:58.94679632Z\",\"_time\":\"2023-01-23T06:07:26.39Z\",\"_value\":78,\"_field\":\"value\",\"_measurement\":\"Diastole\"},{\"result\":\"_result\",\"table\":0,\"_start\":\"2023-01-19T00:35:58.94679632Z\",\"_stop\":\"2023-01-26T00:35:58.94679632Z\",\"_time\":\"2023-01-24T07:07:26.438Z\",\"_value\":78,\"_field\":\"value\",\"_measurement\":\"Diastole\"},{\"result\":\"_result\",\"table\":0,\"_start\":\"2023-01-19T00:35:58.94679632Z\",\"_stop\":\"2023-01-26T00:35:58.94679632Z\",\"_time\":\"2023-01-24T07:22:26.52Z\",\"_value\":71,\"_field\":\"value\",\"_measurement\":\"Diastole\"},{\"result\":\"_result\",\"table\":1,\"_start\":\"2023-01-19T00:35:58.94679632Z\",\"_stop\":\"2023-01-26T00:35:58.94679632Z\",\"_time\":\"2023-01-23T05:51:28.093Z\",\"_value\":114,\"_field\":\"value\",\"_measurement\":\"Puls\"},{\"result\":\"_result\",\"table\":1,\"_start\":\"2023-01-19T00:35:58.94679632Z\",\"_stop\":\"2023-01-26T00:35:58.94679632Z\",\"_time\":\"2023-01-23T06:07:26.392Z\",\"_value\":106,\"_field\":\"value\",\"_measurement\":\"Puls\"},{\"result\":\"_result\",\"table\":1,\"_start\":\"2023-01-19T00:35:58.94679632Z\",\"_stop\":\"2023-01-26T00:35:58.94679632Z\",\"_time\":\"2023-01-24T07:07:26.442Z\",\"_value\":106,\"_field\":\"value\",\"_measurement\":\"Puls\"},{\"result\":\"_result\",\"table\":1,\"_start\":\"2023-01-19T00:35:58.94679632Z\",\"_stop\":\"2023-01-26T00:35:58.94679632Z\",\"_time\":\"2023-01-24T07:22:26.521Z\",\"_value\":85,\"_field\":\"value\",\"_measurement\":\"Puls\"},{\"result\":\"_result\",\"table\":2,\"_start\":\"2023-01-19T00:35:58.94679632Z\",\"_stop\":\"2023-01-26T00:35:58.94679632Z\",\"_time\":\"2023-01-23T05:50:25.342Z\",\"_value\":127,\"_field\":\"value\",\"_measurement\":\"Systole\"},{\"result\":\"_result\",\"table\":2,\"_start\":\"2023-01-19T00:35:58.94679632Z\",\"_stop\":\"2023-01-26T00:35:58.94679632Z\",\"_time\":\"2023-01-23T06:07:26.39Z\",\"_value\":114,\"_field\":\"value\",\"_measurement\":\"Systole\"},{\"result\":\"_result\",\"table\":2,\"_start\":\"2023-01-19T00:35:58.94679632Z\",\"_stop\":\"2023-01-26T00:35:58.94679632Z\",\"_time\":\"2023-01-24T07:07:26.439Z\",\"_value\":114,\"_field\":\"value\",\"_measurement\":\"Systole\"},{\"result\":\"_result\",\"table\":2,\"_start\":\"2023-01-19T00:35:58.94679632Z\",\"_stop\":\"2023-01-26T00:35:58.94679632Z\",\"_time\":\"2023-01-24T07:22:26.521Z\",\"_value\":107,\"_field\":\"value\",\"_measurement\":\"Systole\"}]",
       "payloadType": "json",
       "x": 220,
       "y": 280,
       "wires": [
           [
               "efd1ab4c73f3d571",
               "a9c39616decfa97c"
           ]
       ]
   },
   {
       "id": "4d853addf9c082fb",
       "type": "inject",
       "z": "1983aa28392732ca",
       "name": "",
       "props": [
           {
               "p": "payload"
           },
           {
               "p": "topic",
               "vt": "str"
           }
       ],
       "repeat": "",
       "crontab": "",
       "once": false,
       "onceDelay": 0.1,
       "topic": "Diastole",
       "payload": "88",
       "payloadType": "num",
       "x": 500,
       "y": 120,
       "wires": [
           [
               "2d8acec0ec2da68e"
           ]
       ]
   },
   {
       "id": "2d8acec0ec2da68e",
       "type": "ui_chart",
       "z": "1983aa28392732ca",
       "name": "",
       "group": "57f13d6f733e5c9d",
       "order": 2,
       "width": 0,
       "height": 0,
       "label": "Blutdruck und Puls",
       "chartType": "line",
       "legend": "true",
       "xformat": "dd HH:mm",
       "interpolate": "linear",
       "nodata": "",
       "dot": false,
       "ymin": "",
       "ymax": "",
       "removeOlder": 1,
       "removeOlderPoints": "50",
       "removeOlderUnit": "604800",
       "cutout": 0,
       "useOneColor": false,
       "useUTC": false,
       "colors": [
           "#1f77b4",
           "#aec7e8",
           "#ff7f0e",
           "#2ca02c",
           "#98df8a",
           "#d62728",
           "#ff9896",
           "#9467bd",
           "#c5b0d5"
       ],
       "outputs": 1,
       "useDifferentColor": false,
       "className": "",
       "x": 770,
       "y": 180,
       "wires": [
           []
       ]
   },
   {
       "id": "0ca3dc50cb11869a",
       "type": "inject",
       "z": "1983aa28392732ca",
       "name": "",
       "props": [
           {
               "p": "payload"
           },
           {
               "p": "topic",
               "vt": "str"
           }
       ],
       "repeat": "",
       "crontab": "",
       "once": false,
       "onceDelay": 0.1,
       "topic": "Systole",
       "payload": "170",
       "payloadType": "num",
       "x": 490,
       "y": 160,
       "wires": [
           [
               "2d8acec0ec2da68e"
           ]
       ]
   },
   {
       "id": "efd1ab4c73f3d571",
       "type": "change",
       "z": "1983aa28392732ca",
       "name": "Create Object Arrays",
       "rules": [
           {
               "t": "set",
               "p": "payload",
               "pt": "msg",
               "to": "[\t   {\t       \"series\" : [\"Systole\",\"Diastole\",\"Puls\"],\t       \"data\": [\t           [\t               payload[_measurement=\"Systole\"].{\t                   \"x\" : $toMillis(_time),\t                   \"y\" : _value\t    \t               }\t           ],\t           [\t               payload[_measurement=\"Diastole\"].{\t                   \"x\" : $toMillis(_time),\t                   \"y\" : _value\t    \t               }\t           ],\t           [\t               payload[_measurement=\"Puls\"].{\t                   \"x\" : $toMillis(_time),\t                   \"y\" : _value\t    \t               }\t           ]\t       ],\t       \"labels\" : [\"Systole\",\"Diastole\",\"Puls\"]\t    }\t]",
               "tot": "jsonata"
           }
       ],
       "action": "",
       "property": "",
       "from": "",
       "to": "",
       "reg": false,
       "x": 500,
       "y": 280,
       "wires": [
           [
               "2d8acec0ec2da68e",
               "cb3a1a566bc5679f"
           ]
       ]
   },
   {
       "id": "097b4e4032b4bcff",
       "type": "inject",
       "z": "1983aa28392732ca",
       "name": "",
       "props": [
           {
               "p": "payload"
           },
           {
               "p": "topic",
               "vt": "str"
           }
       ],
       "repeat": "",
       "crontab": "",
       "once": false,
       "onceDelay": 0.1,
       "topic": "Puls",
       "payload": "75",
       "payloadType": "num",
       "x": 510,
       "y": 200,
       "wires": [
           [
               "2d8acec0ec2da68e"
           ]
       ]
   },
   {
       "id": "5b8909ad22babab7",
       "type": "inject",
       "z": "1983aa28392732ca",
       "name": "löschen",
       "props": [
           {
               "p": "payload"
           }
       ],
       "repeat": "",
       "crontab": "",
       "once": false,
       "onceDelay": 0.1,
       "topic": "",
       "payload": "[]",
       "payloadType": "json",
       "x": 510,
       "y": 60,
       "wires": [
           [
               "2d8acec0ec2da68e"
           ]
       ]
   },
   {
       "id": "a9c39616decfa97c",
       "type": "debug",
       "z": "1983aa28392732ca",
       "name": "Array aus InfluxDB Abfrage",
       "active": true,
       "tosidebar": true,
       "console": false,
       "tostatus": false,
       "complete": "payload",
       "targetType": "msg",
       "statusVal": "",
       "statusType": "auto",
       "x": 520,
       "y": 320,
       "wires": []
   },
   {
       "id": "cb3a1a566bc5679f",
       "type": "debug",
       "z": "1983aa28392732ca",
       "name": "Array zur Initialisierung der Chart Node",
       "active": true,
       "tosidebar": true,
       "console": false,
       "tostatus": false,
       "complete": "payload",
       "targetType": "msg",
       "statusVal": "",
       "statusType": "auto",
       "x": 830,
       "y": 280,
       "wires": []
   },
   {
       "id": "57f13d6f733e5c9d",
       "type": "ui_group",
       "name": "Test",
       "tab": "20b3095113f94d70",
       "order": 2,
       "disp": true,
       "width": "6",
       "collapse": false,
       "className": ""
   },
   {
       "id": "20b3095113f94d70",
       "type": "ui_tab",
       "name": "Home",
       "icon": "dashboard",
       "order": 1,
       "disabled": false,
       "hidden": false
   }
]

Du siehst wie man mit einer Change Node durch Filtern von Objekten und gleichzeitiger Neuerstellung - da ist JSONATA wirklich genial, völlig neue Objekte in der gewünschten Form erzeugen kann.

Oben siehst Du ja das Array mit den Datensätzen aus der InfluxDB - das völlig neu erstellt wird, wie die Chart Node es braucht und wie es in der Beschreibung von Steve stand.

Aus diesen Objekten:

wurde diese alle je nach _measurement in verschiedene data Objekte gespeichert und gleichzeitig die Werte für die x und y-Achse generiert.

Im ersten Array = grün findest Du alle systolischen Werte mit dem timestamp als x und der entsprechenden Wert als y.

Im zweiten Array = gelb findest Du alle diastolischen Werte mit dem timestamp als x und der entsprechenden Wert als y.

Im dritten Array = hellblau findest Du alle Puls-Werte mit dem timestamp als x und der entsprechenden Wert als y.

Hier der Inhalt des Change / JSONATA Erstellung des Objektes:

[
   {
       "series" : ["Systole","Diastole","Puls"],
       "data": [
           [
               payload[_measurement="Systole"].{
                   "x" : $toMillis(_time),
                   "y" : _value
    
               }
           ],
           [
               payload[_measurement="Diastole"].{
                   "x" : $toMillis(_time),
                   "y" : _value
    
               }
           ],
           [
               payload[_measurement="Puls"].{
                   "x" : $toMillis(_time),
                   "y" : _value
    
               }
           ]
       ],
       "labels" : ["Systole","Diastole","Puls"]
    }
]

Also wie gesagt beschäftige Dich mit Arrays, Objekten, Filterung und Objekterstellung mit JSONATA.

Wenn Du das mit Javascript programmieren wolltest, bräuchtest Du das Mehrfache an Code.

Wie gesagt der Schlüssel ist der Screenshot, wie die Arrays und Objekte aufgebaut sein müssen, den ich aus dem Artikel von Steve kopiert hatte (https://forum.iobroker.net/post/934428).

[Damrak2022]

@mickym Hallo Micky,
erstmal vielen Dank.

[Damrak2022]

@mickym Also, wenn ich das alles halbwegs richtig verstehe, hast Du hier die Werte von der Systole und Diastole eingearbeitet. Das zeigt sich ja auch im Debug:

Die Nodes für den Puls muss ich noch dementsprechend hinzufügen, richtig?

Ich habe jetzt mal die Chart Node hinten drangehängt, sehe hier aber nur eine Linie, obwohl es laut Debug ja zwei Werte sein müssten, das verwundert mich etwas.

[mickym]

@damrak2022 mach doch bitte das was ich geschrieben habe. Schmeiß alles weg, was du hast. Du brauchst doch nur die Change Node zwischen der chartnode und influx-dB platzieren. Zusätzlich kommen dann noch die aktuellen Werte rein. Ich hab alles beschrieben- ich will’s eigentlich nicht nochmal schreiben.

Siehst du in meinem Flow irgendwelche Switch nodes?? - ich hab doch alles quasi fix und fertig für dich aufbereitet

War wohl mein Fehler - habe einen Mist exportiert! Sorry und Entschuldigung!

[Damrak2022]

@mickym Okay, mache ich. Nur das mit der Change Node war mir nicht klar.

[mickym]

@damrak2022 Ich wundere mich, wie Du überhaupt zu diesen Nodes kommst - das waren meine Fehlversuche - ich schau mal ob ich Dir über haupt das richtige exportiert habe.

Importiere den Flow nochmal neu - ich glaube ich habe beim Export einen Fehler gemacht.

[mickym]

@damrak2022 sagte in Visualisierung mit Node Red erstellen:

@mickym Also, wenn ich das alles halbwegs richtig verstehe, hast Du hier die Werte von der Systole und Diastole eingearbeitet. Das zeigt sich ja auch im Debug:

Die Nodes für den Puls muss ich noch dementsprechend hinzufügen, richtig?

Ich habe jetzt mal die Chart Node hinten drangehängt, sehe hier aber nur eine Linie, obwohl es laut Debug ja zwei Werte sein müssten, das verwundert mich etwas.

Also das war ein Versehen - Du hast meine Tests und Fehlversuche importiert. Der Flow muss so aussehen, wie auf dem Screenshot:

[Damrak2022]

@mickym Jetzt fehlt nur der korrekte Export von Dir

[mickym]

@damrak2022 ich hab das in dem Beitrag unten ausgetauscht- also einfach nochmal neu importieren

[Damrak2022]

@mickym Okay, danke.