aus Tabellen Werten ein Graphen darstellen

Saranger

@mickym said in aus Tabellen Werten ein Graphen darstellen:

@saranger Gut dann kannst Du es natürlich mit der Chart Node darstellen.

https://stevesnoderedguide.com/using-the-node-red-chart-node

Ich helfe Dir gleich mit einem Flow. ;)

danke dir :-)

mickym

@saranger So hier mal der Flow für die Chart Node. ;)

Statt der InjectNode musst halt deine iobroker-In Node verwenden:

[
   {
       "id": "fd717360f0186d05",
       "type": "change",
       "z": "1983aa28392732ca",
       "name": "",
       "rules": [
           {
               "t": "set",
               "p": "payload",
               "pt": "msg",
               "to": "[\t   {\t       \"series\":[\"Power\"],\t       \"data\": [\t           [\t               payload.{\t                   \"x\": $toMillis(Time,'[Y]-[M]-[D] [H]:[m]:[s]'),\t                   \"y\" : Power ~> $replace(\",\",\".\") ~> $number()\t                }\t            ]\t       ]\t}\t]",
               "tot": "jsonata"
           }
       ],
       "action": "",
       "property": "",
       "from": "",
       "to": "",
       "reg": false,
       "x": 530,
       "y": 2440,
       "wires": [
           [
               "9703d36ee0f5ad21"
           ]
       ]
   },
   {
       "id": "9703d36ee0f5ad21",
       "type": "ui_chart",
       "z": "1983aa28392732ca",
       "name": "",
       "group": "2ac8e3fa.8b8584",
       "order": 5,
       "width": "12",
       "height": "11",
       "label": "Power",
       "chartType": "line",
       "legend": "true",
       "xformat": "dd HH:mm",
       "interpolate": "linear",
       "nodata": "",
       "dot": false,
       "ymin": "",
       "ymax": "",
       "removeOlder": 1,
       "removeOlderPoints": "",
       "removeOlderUnit": "3600",
       "cutout": 0,
       "useOneColor": false,
       "useUTC": false,
       "colors": [
           "#1f77b4",
           "#aec7e8",
           "#ff7f0e",
           "#2ca02c",
           "#98df8a",
           "#d62728",
           "#ff9896",
           "#9467bd",
           "#c5b0d5"
       ],
       "outputs": 1,
       "useDifferentColor": false,
       "className": "",
       "x": 710,
       "y": 2440,
       "wires": [
           []
       ]
   },
   {
       "id": "2ac8e3fa.8b8584",
       "type": "ui_group",
       "name": "Default",
       "tab": "ebb1ed1c.5ebe2",
       "order": 1,
       "disp": true,
       "width": "12",
       "collapse": false
   },
   {
       "id": "ebb1ed1c.5ebe2",
       "type": "ui_tab",
       "name": "Charts",
       "icon": "dashboard",
       "disabled": false,
       "hidden": false
   }
]

Wenn du keine Legende oder Beschriftung willst, dann einfach in der Node entsprechend eintragen:

Saranger

@mickym ich hab das mal eingefügt, allerdings bleibt der Chart leer. Wenn ich die debug aber an die inject node hänge wird beim neu laden die debug node gfüllt.

mickym

@saranger

So hier nochmal mit Inject- Node:

[
   {
       "id": "9dedd3abd6ec8e15",
       "type": "inject",
       "z": "1983aa28392732ca",
       "name": "",
       "props": [
           {
               "p": "payload"
           }
       ],
       "repeat": "",
       "crontab": "",
       "once": false,
       "onceDelay": 0.1,
       "topic": "",
       "payload": "[{\"Time\":\"2023-04-17 06:19:59\",\"Power\":\"0,000\"},{\"Time\":\"2023-04-17 07:00:00\",\"Power\":\"0,263\"},{\"Time\":\"2023-04-17 08:00:00\",\"Power\":\"0,635\"},{\"Time\":\"2023-04-17 09:00:00\",\"Power\":\"0,895\"},{\"Time\":\"2023-04-17 10:00:00\",\"Power\":\"1,489\"},{\"Time\":\"2023-04-17 11:00:00\",\"Power\":\"2,020\"},{\"Time\":\"2023-04-17 12:00:00\",\"Power\":\"2,105\"},{\"Time\":\"2023-04-17 13:00:00\",\"Power\":\"2,080\"},{\"Time\":\"2023-04-17 14:00:00\",\"Power\":\"1,999\"},{\"Time\":\"2023-04-17 15:00:00\",\"Power\":\"1,965\"},{\"Time\":\"2023-04-17 16:00:00\",\"Power\":\"1,942\"},{\"Time\":\"2023-04-17 17:00:00\",\"Power\":\"1,676\"},{\"Time\":\"2023-04-17 18:00:00\",\"Power\":\"0,633\"},{\"Time\":\"2023-04-17 19:00:00\",\"Power\":\"0,328\"},{\"Time\":\"2023-04-17 20:00:00\",\"Power\":\"0,098\"},{\"Time\":\"2023-04-17 20:06:30\",\"Power\":\"0,000\"},{\"Time\":\"2023-04-18 06:18:04\",\"Power\":\"0,000\"},{\"Time\":\"2023-04-18 07:00:00\",\"Power\":\"0,425\"},{\"Time\":\"2023-04-18 08:00:00\",\"Power\":\"0,844\"},{\"Time\":\"2023-04-18 09:00:00\",\"Power\":\"0,962\"},{\"Time\":\"2023-04-18 10:00:00\",\"Power\":\"1,071\"}]",
       "payloadType": "json",
       "x": 330,
       "y": 2440,
       "wires": [
           [
               "fd717360f0186d05"
           ]
       ]
   },
   {
       "id": "fd717360f0186d05",
       "type": "change",
       "z": "1983aa28392732ca",
       "name": "",
       "rules": [
           {
               "t": "set",
               "p": "payload",
               "pt": "msg",
               "to": "[\t   {\t       \"series\":[\"Power\"],\t       \"data\": [\t           [\t               payload.{\t                   \"x\": $toMillis(Time,'[Y]-[M]-[D] [H]:[m]:[s]'),\t                   \"y\" : Power ~> $replace(\",\",\".\") ~> $number()\t                }\t            ]\t       ]\t}\t]",
               "tot": "jsonata"
           }
       ],
       "action": "",
       "property": "",
       "from": "",
       "to": "",
       "reg": false,
       "x": 530,
       "y": 2440,
       "wires": [
           [
               "9703d36ee0f5ad21"
           ]
       ]
   },
   {
       "id": "9703d36ee0f5ad21",
       "type": "ui_chart",
       "z": "1983aa28392732ca",
       "name": "",
       "group": "2ac8e3fa.8b8584",
       "order": 5,
       "width": "12",
       "height": "11",
       "label": "",
       "chartType": "line",
       "legend": "false",
       "xformat": "HH:mm:ss",
       "interpolate": "linear",
       "nodata": "",
       "dot": false,
       "ymin": "",
       "ymax": "",
       "removeOlder": 1,
       "removeOlderPoints": "",
       "removeOlderUnit": "3600",
       "cutout": 0,
       "useOneColor": false,
       "useUTC": false,
       "colors": [
           "#1f77b4",
           "#aec7e8",
           "#ff7f0e",
           "#2ca02c",
           "#98df8a",
           "#d62728",
           "#ff9896",
           "#9467bd",
           "#c5b0d5"
       ],
       "outputs": 1,
       "useDifferentColor": false,
       "className": "",
       "x": 710,
       "y": 2440,
       "wires": [
           []
       ]
   },
   {
       "id": "2ac8e3fa.8b8584",
       "type": "ui_group",
       "name": "Default",
       "tab": "ebb1ed1c.5ebe2",
       "order": 1,
       "disp": true,
       "width": "12",
       "collapse": false
   },
   {
       "id": "ebb1ed1c.5ebe2",
       "type": "ui_tab",
       "name": "Charts",
       "icon": "dashboard",
       "disabled": false,
       "hidden": false
   }
]

Jetzt müsstest Du in jedem Fall was sehen. Wenn das Array in der Inject Node anders ist, als was aus Deinem Datenpunkt kommt - musst ggf. noch eine JSON Node dazwischenschalten.

mickym

das Einzige was nicht stimmt ist die Zeit, da das Teil denkt es ist UTC Zeit die eingegeben wurde und dann 2 Stunden draufrechnet.

Um die Zeit also anzupassen:

den JSONATA Code noch wie folgt ändern:

[
   {
       "series":["Power"],
       "data": [
           [
               payload.{
                   "x": $toMillis(Time & " GMT+2:00",'[Y]-[M]-[D] [H]:[m]:[s] [z]'),
                   "y" : Power ~> $replace(",",".") ~> $number()
                }
            ]
       ]
}
]

Die Formatierung bzgl. der Zeitformate entnimmst Du bitte hier:
https://www.w3.org/TR/xpath-functions-31/#func-format-date

mickym

Um sich nicht mit Zeitzonen rum zu quälen, ist die Moments Bibliothek besser. Also Du kannst die Change Node wie folgt abändern (warum das valueOf() für die Umwandlung in ms nicht funktioniert - weiß ich nicht).

[
   {
       "series":["Power"],
       "data": [
           [
               payload.{
                   "x": $moment(Time,("YYYY-MM-DD HH:mm:ss")).unix()*1000,
                   "y" : Power ~> $replace(",",".") ~> $number()
                }
            ]
       ]
}
]

Funktioniert es denn nun?

Saranger

@mickym ich rätsel gerade wo ich das in der change node einfüge das nicht so einfach für mich^^.

mickym

@saranger Dann zeig halt mal Deinen ganzen Flow (bzw. mach halt einen Screenshot) - und wo dieses Objekt dass Du oben gepostet hast, rauskommt. Funktioniert denn der Chart mit meiner Inject Node?

@saranger sagte in aus Tabellen Werten ein Graphen darstellen:

@mickym ich rätsel gerade wo ich das in der change node einfüge das nicht so einfach für mich^^.

Im Prinzip, wenn das Array mit den Datenpunkten so rauskommt, wie oben - einfach vor die Chart Node. Wenn Du mein Flow importiert hast, brauchst doch nur die Inject Node ersetzen?

Homoran

@saranger sagte in aus Tabellen Werten ein Graphen darstellen:

dacht ich war im nodered forum.

im Titel wäre besser. Die Breadcrumbs übersieht man meist

mickym

@homoran Na ich nicht ;) - Sonst wüsste ich ja nicht, wann ich puzzeln muss oder Nodes zeichnen darf. ;) Ich hab mich dann meist entschuldigt, wenn ich festgestellt habe, dass ich mich im falschen Unterforum befinde. ;) Und die meisten Blocklies schreiben auch nicht immer Blockly in die Überschrift. Oder müssen sich hier Minderheiten besonderen Regeln unterwerfen? :grin:

Homoran

@mickym sagte in aus Tabellen Werten ein Graphen darstellen:

die meisten Blocklies schreiben auch nicht immer Blockly in die Überschrift.

wievielfache Negation ist das denn :joy:

Wäre aber schön!
Ich gehe immer über Unread und nie über die Kategorie in einen Post

Saranger

@homoran ich werde bei nächsten mal das genauer schreiben :-)

mickym

@homoran sagte in aus Tabellen Werten ein Graphen darstellen:

@mickym sagte in aus Tabellen Werten ein Graphen darstellen:

die meisten Blocklies schreiben auch nicht immer Blockly in die Überschrift.

wievielfache Negation ist das denn :joy:

Wäre aber schön!
Ich gehe immer über Unread und nie über die Kategorie in einen Post

Na ich gehe auch nur immer über Unread oder neueste Themen in einen Post, aber als Minderheit habe ich einen geschärften Blick für das Forum, in dem sich der Thread befindet. - Tja das scheint wohl unser Schicksal zu sein - wenn die Mehrheiten immer Dinge für selbstverständlich nehmen. ;)

Saranger

@mickym

schaut so aus

[
   {
       "id": "9ecdae960fb1ba35",
       "type": "ioBroker in",
       "z": "2c0306d707fdc5d0",
       "name": "PV Today",
       "topic": "pvforecast.0.plants.süd.JSONTable",
       "payloadType": "value",
       "onlyack": "",
       "func": "all",
       "gap": "",
       "fireOnStart": "true",
       "outFormat": "MQTT",
       "x": 120,
       "y": 740,
       "wires": [
           [
               "ca31e8e8970bc051",
               "a43328d1fc72822f"
           ]
       ]
   },
   {
       "id": "ca31e8e8970bc051",
       "type": "debug",
       "z": "2c0306d707fdc5d0",
       "name": "debug 63",
       "active": true,
       "tosidebar": true,
       "console": false,
       "tostatus": false,
       "complete": "false",
       "statusVal": "",
       "statusType": "auto",
       "x": 300,
       "y": 640,
       "wires": []
   },
   {
       "id": "a43328d1fc72822f",
       "type": "change",
       "z": "2c0306d707fdc5d0",
       "name": "",
       "rules": [
           {
               "t": "set",
               "p": "payload",
               "pt": "msg",
               "to": "[\t   {\t       \"series\":[\"Power\"],\t       \"data\": [\t           [\t               payload.{\t                   \"x\": $moment(Time,(\"YYYY-MM-DD HH:mm:ss\")).unix()*1000,\t                   \"y\" : Power ~> $replace(\",\",\".\") ~> $number()\t                }\t            ]\t       ]\t}\t]",
               "tot": "jsonata"
           }
       ],
       "action": "",
       "property": "",
       "from": "",
       "to": "",
       "reg": false,
       "x": 430,
       "y": 740,
       "wires": [
           [
               "ad72ed9b6215e0c3"
           ]
       ]
   },
   {
       "id": "ad72ed9b6215e0c3",
       "type": "ui_chart",
       "z": "2c0306d707fdc5d0",
       "name": "",
       "group": "2ac8e3fa.8b8584",
       "order": 5,
       "width": "12",
       "height": "11",
       "label": "",
       "chartType": "line",
       "legend": "false",
       "xformat": "HH:mm:ss",
       "interpolate": "linear",
       "nodata": "",
       "dot": false,
       "ymin": "",
       "ymax": "",
       "removeOlder": 1,
       "removeOlderPoints": "",
       "removeOlderUnit": "3600",
       "cutout": 0,
       "useOneColor": false,
       "useUTC": false,
       "colors": [
           "#1f77b4",
           "#aec7e8",
           "#ff7f0e",
           "#2ca02c",
           "#98df8a",
           "#d62728",
           "#ff9896",
           "#9467bd",
           "#c5b0d5"
       ],
       "outputs": 1,
       "useDifferentColor": false,
       "className": "",
       "x": 630,
       "y": 740,
       "wires": [
           []
       ]
   },
   {
       "id": "2ac8e3fa.8b8584",
       "type": "ui_group",
       "name": "Default",
       "tab": "ebb1ed1c.5ebe2",
       "order": 1,
       "disp": true,
       "width": "12",
       "collapse": false
   },
   {
       "id": "ebb1ed1c.5ebe2",
       "type": "ui_tab",
       "name": "Charts",
       "icon": "dashboard",
       "disabled": false,
       "hidden": false
   }
]

mickym

@saranger Ja wie gesagt - da kommt in der Debug Node ein String raus - Du musst Datenpunkte vom iobroker, wenn sie JSONs sind noch in Objekte wandeln. Klemm einfach noch eine JSON Node zwischen Deine iobrokerIN und die Change Node.

Homoran

@mickym sagte in aus Tabellen Werten ein Graphen darstellen:

einen geschärften Blick

auch auf dem Handy/Tablet?
bin zu 99.99% nur damit unterwegs.

mickym

@homoran sagte in aus Tabellen Werten ein Graphen darstellen:

@mickym sagte in aus Tabellen Werten ein Graphen darstellen:

einen geschärften Blick

auch auf dem Handy/Tablet?
bin zu 99.99% nur damit unterwegs.

Auf dem Handy schauts sogar noch klarer aus bei mir. ;)

Saranger

@mickym perfekt jetzt gehts :-)

mickym

@saranger sagte in aus Tabellen Werten ein Graphen darstellen:

@mickym perfekt jetzt gehts :-)

Freut mich. :+1: :+1: :+1:

Homoran

@mickym jetzt aber [/OT]
da muss ich einfach mal ne neue Brille haben

Ich werde versuchen mehr darauf zu achten

Community Forum

NEWS

aus Tabellen Werten ein Graphen darstellen

Support us

710

32.6k

82.2k

1.3m