Betrachtungen zum aktuellen Feinstaub-Alarm (inkl. Anleitung für Visualisierungen)

Es ist ja wirklich schade, dass man in die Diagramme noch nicht hineinzoomen kann. Doch die Diagramme sind mit purem Javascript generiert und so sind eigene Modifikationen problemlos möglich.

An einem einfachen Beispiel will ich in diesem Artikel zeigen, wie ich mir eine schnelle Visualisierung der Feinstaubbelastung des momentanen Feinstaubalarms bastle, in der ich die Sensoren des OK Lab Stuttgart mit dem offiziellen Sensor des LUBW am Standort Neckartor vergleiche.

Den Ausgang bildet das Diagramm Vergleich der Feinstaubbelastung zwischen den Stuttgarter Stadtbezirken. Unter dem Diagramm steht der Link zum eigentlichen Diagramm.

Wenn ich es öffne, komme ich zu einer Vollbilddarstellung des Diagramms. Heutige Browser bieten eine Möglichkeit, dieses Diagramm zu manipulieren. Darauf greifen wir nun zurück, um die Skalierung der Achsen zu ändern.

In Firefox findet sich diese Funktionalität unter Extras -> Web-Entwickler -> Debugger. Ganz unten blinkt nun ein Cursor neben zwei spitzen Klammern (>>). In Safari muss ich in den Einstellungen unter Erweitert „Menü ‚Entwickler‘ in der Menüleiste anzeigen“ aktivieren und anschließend über Entwickler -> Webinformationen einblenden eine ähnliche Oberfläche wie in Firefox aktivieren. Auch hier gibt es eine leere Zeile mit einer spitzen Klammer davor (>).

In diese Zeile kann ich nun Befehle eingeben. Zuerst ändere ich die Skalierung des Diagramms.

Der momentane Feinstaubalarm begann am 15. Januar 2017, sein Ende ist noch offen. Die Zeitachse ist in diesem Diagramm die x-Achse, auf der y-Achse ist die Feinstaubbelastung aufgetragen.

Ich ändere nun die x-Achse, indem ich erst einmal Minimum und Maximum neu setze (anschließend Enter nicht vergessen):

xScale.domain([parseDate("20170115000000"),parseDate("20170128080000")]);

parseDate liest eine Datumsangabe mit dem Format JahrMonatTagStundeMinuteSekunde. In diesem Fall vom 15. Januar 2017, 0 Uhr (erste Angabe) bis zum 24. Januar 2017, 8 Uhr (zweite Angabe). Der 24. liegt in der Zukunft und führt so später zu einer schöneren Ansicht.

Um die Anzeige zu aktualisieren, muss ich nun noch einen Befehl hinterherschicken (und wieder Enter nicht vergessen):

resize();

Das Diagramm sollte nun in etwa folgendermaßen aussehen:

In der selben Weise wie ich die x-Achse geändert habe, kann ich nun auch die y-Achse ändern:

yScale.domain([0,300]);
resize();

Das Diagramm ist nun schon deutlich lesbarer und sollte so aussehen:

Was mich nun weiter interessiert ist die grau gestrichelte Kurve, die mit LUBW Neckartor beschriftet ist und die rote Kurve mit den OK Lab Stuttgart-Messwerten aus dem Stadtbezirk Stuttgart Mitte.

Hierfür nutze ich die Funktionalität, die schon dazu dient, alle anderen Linien auszublenden, wenn ich mit der Maus über einer bestimmten Linie bin.

$(".P1").addClass("fadeout");

Jetzt sollten alle Linien unleserlich ausgeblichen sein.

Mit folgenden Befehlen zeige ich nun Stuttgart Mitte und den Sensor LUBW Neckartor deutlich an:

$(".Stuttgart_Mitte").addClass("hover");
$(".statDEBW118pm10").addClass("hover");

Das Ergebnis zeigt nun spannende Abweichungen zwischen den beiden Kurven:

Zu Beginn des aktuellen Feinstaubalarms sahen die Sensoren vom OK Lab Stuttgart noch überhaupt keinen Grund zur Aufregung. Im Gegensatz zum Sensor LUBW Neckartor, der schon am 17.1. die 50 Mikrogramm Feinstaub überschritten hat, folgten die OK Lab-Sensoren in Mitte erst am frühen Morgen des 19. Januar, holten sehr schnell auf und verharrten dann bis zur Nacht auf den 21. Januar stabil auf 80 Mikrogramm, um dann wieder kontinuierlich bis heute zu steigen und die offiziellen Werte, die unter 140 Mikrogramm blieben, mit über 240 Mikrogramm weit hinter sich zu lassen.