SVG Grid und Datendarstellung

[Matthias Scharwies]

Servus!

Hallo,

ich habe da ein Projekt übernommen, in dem mittels SVG zeitliche Datenverläufe dargestellt werden. Das ist aber leider ziemlich verknotet.

Ich würde daher gerne möglichst strukturiert und von vorne anfangen.

Das ist eines unserer Zukunftsprojekte:

Daten aus einem Mikro-Controller (Raspberry, Arduino, etc) auslesen und dann mit HTML ausgeben.

SVG würde dann die Datenvisualisierung übernehmen.

Und da liegt unser „ewiges“ ToDo - jedenfalls seit 2016 nicht fertiggestellt. 😕 😟

• Datenvisualisierung

Ich brauche ein grobes Raster für jeweils 31 Tage und Werte zwischen Minus 20 und Plus 40 (kWh).

Das würde ich mit JavaScript dynamisch erstellen: mal 28, mal 30 und mal 31 Tage auf einer SVG-Leinwand.

Wie kann ich so ein Raster erstellen?

Ein kartesisches Koodinatensystem eher nicht, aber eben zwei Achsen mit Beschriftung (und entsprechenden role-Attributen).

Kann ich dann später mehrere Kurven für Vormonat, Monat, Vorjahr..., oder so ähnlich in verschiedenen Farben reinzeichnen? Die Werte liegen in CSV-Dateien vor und mit PHP kann ich so einigermaßen gut umgehen.

Außerdem will der Eine Kurven und die Andere Balkendiagramme.
Das muss also variabel bleiben.

Ja, entweder mit @JürgenB s Funktionsplotter

oder mit einem Balkendiagramm-Generator - das ist im SELF-Wiki leider eine Baustelle. 😕 😟

Wie könnte man das Ganze für SVG also modularisieren?

Ein Objekt mit vielen Methoden

Herzliche Grüße

Matthias Scharwies