Visualisierung mit Node Red erstellen

[mickym]

@damrak2022 Sehr gut.

[{"series":["Küche"],"data":[[$.{}]]}]

Du siehst also für jeden Datensatz ein leeres Objekt:

[Damrak2022]

@mickym Ja, sieht bei mir auch so aus.

[mickym]

@damrak2022 Sehr gut - und welche 2 Eigenschaften haben denn nun die Punkte in unserem Array.

Jeder Punkt in einem Linienchart hat ein ... - Koordinate und ein ... - Koordinate.

[Damrak2022]

@mickym Ich weiß nicht was Du mit Punkten meinst?

[Damrak2022]

@damrak2022 Ach Du meinst X und Y Koordinate

[mickym]

@damrak2022 sagte in Visualisierung mit Node Red erstellen:

@mickym Ich weiß nicht was Du mit Punkten meinst?

Na jedes Objekt in dem Array ist ein Datenpunkt - des x und y Koordinaten in dem originalen Datensatz steht.

[Damrak2022]

@mickym Ja, verstanden.

[mickym]

@damrak2022 sagte in Visualisierung mit Node Red erstellen:

@damrak2022 Ach Du meinst X und Y Koordinate

Genau - Du siehst ja an Steves Screenshot - das jeder Punkt KLEINgeschrieben die Eigenschaft. x und y hat.

Nun definierst Du also für alle Objekte die Eigenschaft x und y mit dem Wert 0 erst mal. Also in die neu geschweifte Klammer hinter dem $. eine Eigenschaft "x" : 0 und "y" : 0

[Damrak2022]

@mickym

[mickym]

@damrak2022 sagte in Visualisierung mit Node Red erstellen:

@mickym

Sehr gut - Du solltest also sehen, dass Deine Objekt jetzt überall x und y Eigenschaften haben:

Falls wir morgen weiter machen - solltest Du den Code dann wieder in das Codefenster hier aus dem Thread kopieren kannst:

[{"series":["Küche"],"data":[[$.{"x":0,"y":0}]]}]

[Damrak2022]

@mickym Habe das nun wieder so hergestellt:

[mickym]

@damrak2022 So um zu sehen, dass Du auch alles von vorgestern verstanden hast. Erkläre doch bitte mal Deinen JSONATA Code.

[{"series":["Küche"],"data":[[$.{"x":0,"y":0}]]}]

Erkläre bitte mal Zeichen für Zeichen.

Also

1. Eckige Klammer - [
2. Geschweifete Klammer .
3. Was ist der String der folgt
4. Was ist der Doppelpunkt
5. Was ist die eckige Klammer [

usw.

also ich würde gerne den Code nochmals von Dir erklärt bekommen. - Danke schon mal.

[Damrak2022]

@mickym Oh Gott, na gut - Moment

[mickym]

@damrak2022 sagte in Visualisierung mit Node Red erstellen:

@mickym Oh Gott, na gut - Moment

Lass Dir ruhig Zeit - lieber exakt und richtig - als schnell und schlampig.

[Damrak2022]

@mickym Die eckige Klammer [ stellt die Eröffnung eines Array dar. Darauf folgt die geschweifte Klammer (Objekt) mit der Eigenschaft "series". welche wiederum ein Array beinhaltet, welches in A,B,C (topic) unterteilt ist. Ich weiß das der Doppelpunkt da hin muss, kann ihn aber nicht erklären.
Unter data sind die das x und x jeweils die Koordinaten, welche die Chart node benötigt. Die sind jeweils innerhalb eines Objekts was wiederum in einem Array pro serie ist. Ganz zum Schluss wird das erste Array wieder ] geschlossen.

[mickym]

@damrak2022 sagte in Visualisierung mit Node Red erstellen:

Bitte richtig mit Zahlen. Der erste Satz ist zwar richtig . aber dann wirds schlampig.

Ich sehe kein Array mit A,B,C . Ein Array st auch nicht unterteilt sondern enthält ein oder mehrere Elemente. Und was data ist und x und x und die Zeichen dazwischen passt alles nicht.

Bitte wie unten beschrieben jedes Zeichen erklären (gut bei Eigenschaften wie series - darfst Du schreiben es ist eine Eigenschaft als String.=

Also

1. Eckige Klammer - [ ==> Definiert den ersten Datentyp ein Array

2. Geschweifete Klammer - { ==> Definiert das erste Element dieses Arrays - ein Objekt .

3. Was ist der String der folgt . { Legt den Namen der 1. Eigenschaft des Objektes fest, das unter 2. definiert wurde .

4. Was ist der Doppelpunkt

5. Was ist die eckige Klammer [

6. String
   6a Eckige Klammer zu.

7. Komma

8. String

9. Doppelpunkt

10. eckige Klammer

11. eckige Klammer

12. $ Zeichen

13. Punkt

14. Geschweifte Klammer

15. String

16. Doppelpunkt

17. Zahl,

18. Komma

19. String

20. Doppelpunkt

21. Zahl

22. Geschweifte Klammer

23. Eckige Klammer

24. Eckige Klammer

25. Geschweifte Klammer

26. Eckige Klammer

Wenn ich Dir nun alle 26 Zeichen aufschreiben konnte, dann kannst Du auch jedes Zeichen erklären.

Kopiere Dir dieser 26 Zeilen und schreibe hinter jeden Punkt die Erklärung.

lerne exakt zu sein.

[Damrak2022]

@mickym

Eckige Klammer - [ ==> Definiert den ersten Datentyp ein Array

Geschweifete Klammer - { ==> Definiert das erste Element dieses Arrays - ein Objekt .

Was ist der String der folgt . { Legt den Namen der 1. Eigenschaft des Objektes fest, das unter 2. definiert wurde .

Was ist die eckige Klammer [ ist ein Array

String ist eine Zeichenkette und legt den Namen des Objekts fest

Komma - damit werden Elemente oder Eigenschaften voneinander getrennt

eckige Klammer - Array

eckige Klammer - Array

$ Zeichen gibt die Payload unverändert wieder aus

Punkt

Geschweifte Klammer - Objekt

Zahl, - ist der Wert, also z.B. time oder Value

Doppelpunkt - trennt den eigentlichen Wert von der Bezeichnung der Eigenschaft

[mickym]

@damrak2022 sagte in Visualisierung mit Node Red erstellen:

@mickym

Eckige Klammer - [ ==> Definiert den ersten Datentyp ein Array

Geschweifete Klammer - { ==> Definiert das erste Element dieses Arrays - ein Objekt .

Was ist der String der folgt . { Legt den Namen der 1. Eigenschaft des Objektes fest, das unter 2. definiert wurde .

Was ist der Doppelpunkt ???????????????????

Was ist die eckige Klammer [ ist ein Array ????????????? von welchem

String ist eine Zeichenkette und legt den Namen des Objekts fest ??????????? welches Objekt ????????????

Komma - damit werden Elemente oder Eigenschaften voneinander getrennt ??????? Eigenschaft oder Element von Array oder Objek??????????????

String

Doppelpunkt

eckige Klammer - Array

eckige Klammer - Array

$ Zeichen gibt die Payload unverändert wieder aus

Punkt

Geschweifte Klammer - Objekt

String

Doppelpunkt - weiß nicht wie ich das erklären soll

Zahl, - ist der Wert, also z.B. time oder Value

Komma

String

Doppelpunkt - trennt den eigentlichen Wert von der Bezeichnung der Eigenschaft

Zahl

Geschweifte Klammer

Eckige Klammer

Eckige Klammer

Geschweifte Klammer

Eckige Klammer

Genau bitte.

[Damrak2022]

@mickym

Eckige Klammer - [ ==> Definiert den ersten Datentyp ein Array

Geschweifete Klammer - { ==> Definiert das erste Element dieses Arrays - ein Objekt .

Was ist der String der folgt . { Legt den Namen der 1. Eigenschaft des Objektes fest, das unter 2. definiert wurde .

Was ist die eckige Klammer [ ist ein Array

String ist eine Zeichenkette und legt den Namen des Objekts fest

Komma - damit werden Elemente oder Eigenschaften voneinander getrennt

eckige Klammer - Array

eckige Klammer - Array

$ Zeichen gibt die Payload unverändert wieder aus

Punkt

Geschweifte Klammer - Objekt

Zahl, - ist der Wert, also z.B. time oder Value

Doppelpunkt - trennt den eigentlichen Wert von der Bezeichnung der Eigenschaft

[Damrak2022]

@mickym

1. Eckige Klammer - [ ==> Definiert den ersten Datentyp ein Array

2. Geschweifte Klammer - { ==> Definiert das erste Element dieses Arrays - ein Objekt .

3. Was ist der String der folgt . { Legt den Namen der 1. Eigenschaft des Objektes fest, das unter 2. definiert wurde .

4. Was ist der Doppelpunkt - Trennt den Wert von dem folgenden Array

5. Was ist die eckige Klammer [ - eröffnet ein Array

6. String - Legt den Namen der 1. Eigenschaft des Objektes fest

7. Eckige Klammer zu. - schließt das Array ab

8. Komma - trennt den Wert der Eigenschaft von der nächsten Eigenschaft "data".

9. String - Legt den Namen der zweiten Eigenschaft fest

10. Doppelpunkt - trennt den Wert von dem folgenden Array

11. eckige Klammer - eröffnet ein Array

12. eckige Klammer - eröffnet ein Array im vorhergehenden Array

13. $ Zeichen gibt die Payload unverändert wieder aus

14. Punkt - Weiß ich nicht was der für eine Funktion/Bedeutung hat

15. Geschweifte Klammer - eröffnet ein Objekt

16. String - legt den Namen des ersten Koordinationspunktes fest.

17. Doppelpunkt - trennt den Wert von der Eigenschaft der vorhergehenden Strings

18. Zahl - schreibt den Wert "0" zu dem vorhergehenden String

19. Komma - trennt die Eigenschaft des ersten Strings vom folgenden.

20. String - legt den Namen des zweiten Koordinationspunktes fest

21. Doppelpunkt - trennt den Wert von der Eigenschaft der vorhergehenden Strings

22. Zahl - schreibt den Wert "0" zu dem vorhergehenden String

23. Geschweifte Klammer - schließt das Objekt

24. Eckige Klammer - schließt das Array in dem sich die Objekte mit den Eigenschaften "x" und "y" befinden.

25. Eckige Klammer - schließt das Array innerhalb des Arrays "data".

26. Geschweifte Klammer - schließt das Objekt "series ab

27. Eckige Klammer - schließt das als allererstes eröffnet Array ab.