Der erste Schritt zur Visualisierung von Live-Daten ist die Sicherstellung einer ordnungsgemäßen, automatisierten Datenerfassung. Wir nutzen einen Raspberry Pi. Dieser ist an unterschiedlichen Sensoren angeschlossen, welche sich auf dem Dach befinden. Die Daten werden in einem festgelegten Zeitintervall in eine Datenbank geschrieben. Im nächsten Schritt muss sichergestellt werden, dass die Datenerfassung automatisiert wurde und zuverlässig funktioniert. Erst dann muss eine Lösung zur Visualisierung in Echtzeit gefunden werden. Dafür gibt es z.B. sehr viele Möglichkeiten über Javascript. Da wir uns gegen Javascript entschieden haben, werden wir vermutlich mit einem oder mehreren verschiedenen WordPress Plugins arbeiten. Bei besonders guter Eignung für unseren Zweck werden wir evtl. sogar auf kostenpflichtige Plugins zurückgreifen.

Eine Javascript-Lösung für die Datenvisualisierung wäre – auch wenn wir uns dagegen entschieden haben – in der Theorie natürlich möglich und wir möchten Ihnen einige Informationen dazu zur Verfügung stellen. Dies könnte dann umgesetzt werden, indem z.B. über SQL in die Datenbank zugegriffen wird, anschließend ein PHP Array mit den entsprechenden Daten erzeugt wird und dieses in der ausgewählten Javascript Bibliothek genutzt wird (Formatierung beachten! – Die Notwendigkeit von eckigen oder runden Klammern, Kommas oder Semicolon, etc. ist je nach Javascript Bibliothek unterschiedlich!). Hier empfiehlt es sich jedoch, eine geeignete Methode zur tatsächlichen Implementierung zu kennen. HTML Injection ist nicht die sicherste Variante, jedoch schnell umsetzbar. Ein Auslesen von persönlichen Daten könnte Hackern dadurch jedoch ermöglicht werden. Bei ganz schlechter Umsetzung könnten dann z.B. die Zugangsdaten zur Datenbank öffentlich eingesehen werden, was in jedem Fall zu verhindern ist.

Javascript Bibliotheken

Javascript Bibliotheken für die Visualisierung von Daten können teils kompliziert sein. Für Experten empfehlen wir d3, da diese Bibliothek vielfältige und dynamische Möglichkeiten bietet.

Für Anfänger mit Python-Kenntnissen (Matplotlib) empfehlen wir mpld3. Diese Bibliothek ermöglicht die Umwandlung von Matplotlib Diagrammen in Python zu Javascript mit relativ geringem Aufwand.

Für Anfänger, die noch nie an einer vergleichbaren Aufgabe gesessen sind und auch nicht über Python-Kenntnisse verfügen, empfehlen wir Morris.js und Chart.js. Mit diesen Javascript Bibliotheken kann man ebenfalls mit relativ geringem Aufwand Diagramme erstellen. Viele wichtige Funktionen sind jedoch z.T. nicht vorhanden. So ist es in Morris.js nicht möglich Legenden automatisch zu erstellen (kann über HTML manuell als Tabelle erstellt werden) und in Chart.js hatten wir Probleme mit deutschen Umlauten sowie mit bestimmten Sonderzeichen in der y-Achsenbeschriftung.

Vielleicht wurden Sie durch diesen Artikel etwas schlauer. Wir geben selbstverständlich nur unsere persönliche Einschätzung ab. Probieren Sie doch am besten einfach die Bibliotheken aus!