Dieses kleine Scrollytelly-Projekt, basiert auf einem älteren Projekt, in dem ich mich mal mit OpenStreetMap (OSM) beschäftigen wollte. Das Projekt fragt Daten bei OSM über die Overpass API an und kategorisiert die unterschiedliche Straßen und Wege nach Nutzbarkeit für PKW, Fußgänger:innen und Fahrräder. Mit einigen wenigen Annahmen der Straßenbreiten kann man beginnen grobe Raumanalysen zu betreiben.
Mobile Ansicht im Scrollytelly, der die Fahrrad-Infrastruktur zeigt, mit dem Rest der Straßen in grau.
Geteilter Raum der Straßen, auf dem sich mehr als ein Mobilitätstyp bewegt. Aufgeschlüsselt nach Mobilitätstypen. die Größte fläche der Treemap ist PKW+Fahrräder mit 0.82km².
Mir war in diesem Projekt wichtig einige technische Dinge auszuprobieren. Einige Wochen zuvor bin ich auf die großartigen Arbeiten von The Pudding gestoßen. Ich fand heraus das sie eine Svelte-Starter veröffentlicht haben, den musste ich sofort ausprobieren, besonders weil dieser intensiv mit LayerCake arbeitet. LayerCake ist eine Bibliothek um Svelte Komponenten anhand der Container-Dimensionen zu managen. Hier habe ich es gemeinsam mit D3 genutzt um uA. eine scrollbare Treemap für die Raumverteilung zu bauen:
Ein Video der Übergänge zwischen unterschiedlichen Teilen der Treemap. Zuerest ein Überblick der die Fahrrad-Only Straßen einzeichnet, dann die geteilte Aufschlüsselung im Detail und zuletzt eine Verschiebung zu den Details der PKW Infrastruktur.
Ganz nebenbei kann man mobile und Desktopversionen ganz hervorragend gemeinsam gestalten wenn man LayerCake nutzt. Unten zwei Beispiele für mobile Geräte.
Mobile Ansicht im Scrollytelly, der die Fahrrad-Infrastruktur zeigt, mit dem Rest der Straßen in grau.
Tablet-Ansicht der Treemap Fläche nach Mobilitätstyp, auf der obersten Hierarchieebene. Rechtecke entsprechen der Größe der Fläche. Farbig hervorgehoben der Fläche von Fahrrädern, die aus der dem Scroll-Status der vorhergegangenen Visualisierung aufgegriffen wird.
Zum vorläufigen Abschluss – für mich ist dieses Projekt work in progress – wird die Zulassungsstatistik der Stadt Tübingen auf der ersten Karte nach Stadtteilen visualisiert.
Ein einfacher Dreiecken-Radar-Chart ist das visuelle Atom, um drei variablen miteinander in Verbindung zu bringen (1) Anteil des Stadtteils an der Bevölkerung, (2) private PKW pro Kopf, und (3) gewerbliche PKW pro Kopf.
Legende der Kartenvisualisierung, als Dreiecken-Radar-Chart. Beölkerung mitte, private PKW rechts, gewerbliche PKW links, am Beispiel vom Alten Güterbahnhof.
Tablet-Ansicht der Zulassungskarte der Stadtteile. Punkte sind interaktiv klickbar, um den Einwohneranteil an der Stadt, und der pro-Kopf private und gewerblich gemeldete PKW.