Fast wären ersten Gehversuche mit D3.js in dem ewigen Unter-unter-unter-Ordner verschwunden. Doch gestern habe ich mich doch noch einmal zusammengerissen und eine Visualisierung der Sitzverteilung im bayerischen Landtag seit 1946 fertiggestellt.
Sie basiert auf D3.js, einer JavaScript-Library. Dieser D3.js-Code erstellt Vektor-Grafiken, die dann im Browser dargestellt werden.
Vor etwa einem Monat habe ich mich ein bisschen eingearbeitet. Empfehlen kann ich das Tutorial von Scott Murray, der auch ein Buch darüber beim O’Reilly-Verlag veröffentlicht hat.
Die Funktionalitäten von D3.js ist nicht besonders intutiv und ganz dahinter gestiegen bin ich immer noch nicht – aber hey, ich konnte ziemlich schnell bunte Quadrate erstellen! Baam!
Ich habe für jede Wahl einen Array mit Daten erstellt, bei denen zum Beispiel die CSU die Zahl 1 zugewiesen bekommen hat. Hat die CSU zB 100 Sitze, gibts hundertmal eine 1. Diese 1 werden dann schwarze Quadrate. Analog bei den anderen Parteien.
Doch dann stieß ich an die Frustrationsgrenze: Auch mit der Hilfe von diversen Google-Suchen, Tutorials und StackOverflow habe es nicht geschafft, die Daten aus einem csv-File zu importieren. Damit wäre der Code unabhänig vom jeweiligen Datenset. Und ohne csv-Datei, also mit den Daten der einzelnen Legislaturperioden in einem Script, kann ich freshe Transformationen in D3 vergessen.
Und dabei wollte ich genau das: Freshe, funky fliegende bunte Quadrate.
Jetzt stand ich vor der Wahl: Lass ich Daten irgendwann von der Festplatte verschwinden oder mache ich doch noch etwas draus – auch wenn es keine fliegenden Quadrate gibt?
Jetzt also: Statisch, auf HTML-Seiten, mit Arrays statt aus einem CSV-File. Egal: Es funktioniert!
