An meinem Wetterradar unter wetter.larsmueller.net schraube ich ja immer mal wieder herum. Angefangen hat das Ganze im Grunde als relativ einfache Wetterkarte, inzwischen sind dort aber Niederschlagsradar, Satellitenbilder, Wind und die Warnungen des Deutschen Wetterdienstes zusammengekommen.
Jetzt kommt noch etwas dazu, was meiner Meinung nach ziemlich gut auf so eine Karte passt: aktuelle Pegelstände.
Dafür greife ich auf die PEGELONLINE-API der Wasserstraßen- und Schifffahrtsverwaltung des Bundes zurück. Die Daten sind öffentlich abrufbar und die REST-API benötigt keine Anmeldung oder irgendeinen API-Key.
Pegelstände direkt auf der Wetterkarte
Die Idee dahinter ist eigentlich recht simpel.
PEGELONLINE stellt die Messstationen samt geografischer Position und den dazugehörigen Wasserständen bereit. Da mein Wetterradar sowieso auf Leaflet basiert, kann ich diese Stationen direkt als zusätzliche Marker auf der vorhandenen Karte darstellen.
Die Pegelstände werden dabei eine eigene Kartenebene. Wer sie sehen möchte, schaltet sie über das Bedienpanel ein. Wer nur Regenradar, Satellitenbild oder Wind sehen möchte, lässt sie einfach ausgeschaltet.
Ich wollte die Pegel bewusst nicht dauerhaft auf der Karte haben. Je nach Zoomstufe kommen schließlich einige Stationen zusammen und irgendwann sieht man vor lauter Markern die eigentliche Wetterkarte nicht mehr.
Nicht nur irgendeine selbst gebastelte Ampel
Interessant finde ich vor allem, dass PEGELONLINE beim aktuellen Wasserstand bereits eine Bewertung mitliefert.
Die API kennt bei Wasserständen unter anderem die Zustände low, normal, high, unknown, commented und out-dated. Dabei können die Werte beispielsweise in Beziehung zu MNW und MHW gesetzt werden, also den mittleren niedrigsten und mittleren höchsten Wasserständen.
Das ist für meine Karte ziemlich praktisch. Ich muss mir nicht selbst irgendwelche Grenzwerte ausdenken, die am Ende womöglich überhaupt keinen Sinn ergeben.
Die Marker möchte ich deshalb entsprechend einfärben:
- Blau: Wasserstand niedrig
- Grün: Wasserstand normal
- Rot: Wasserstand hoch
- Grau: Status unbekannt, Messwert gestört oder veraltet
Damit sieht man auf der Karte relativ schnell, wo etwas auffällig ist.
Wichtig ist allerdings: Das ist keine von mir berechnete Hochwasserwarnung. Ich stelle lediglich den von PEGELONLINE gelieferten Status dar. Das sollte man auseinanderhalten.
Ein Klick liefert weitere Informationen
Nur eine Zahl auf der Karte wäre mir dann doch etwas zu wenig.
Klickt ihr einen Pegelmarker an, öffnet sich deshalb ein kleines Popup. Dort sollen die wichtigsten Informationen zur jeweiligen Messstation stehen:
- Name der Messstation
- Gewässer
- aktueller Wasserstand
- Status
- Zeitpunkt der Messung
Der eigentliche Messwert kommt bei der Wasserstands-Zeitreihe in Zentimetern. PEGELONLINE liefert zusammen mit dem aktuellen Wert außerdem einen Zeitstempel. So lässt sich direkt erkennen, wie aktuell die angezeigte Messung überhaupt ist.
Gerade letzteres finde ich wichtig. Ein Wasserstand ohne Information darüber, von wann dieser Wert stammt, bringt schließlich nur bedingt etwas.
Die Daten werden nicht ständig neu abgerufen
Ich möchte PEGELONLINE auch nicht bei jeder kleinen Aktion auf der Karte mit neuen Requests bombardieren.
Deshalb werden die Pegeldaten erst geladen, wenn ihr die Ebene aktiviert. Danach ist eine automatische Aktualisierung alle sechs Stunden vorgesehen.
Die API selbst unterstützt übrigens HTTP-Caching mit Cache-Control, Expires und ETags. PEGELONLINE ist also grundsätzlich darauf ausgelegt, dass Clients nicht stumpf immer wieder die kompletten Daten herunterladen.
Für mein Wetterradar reichen sechs Stunden als zusätzliches Aktualisierungsintervall erst einmal aus. Das kann ich später immer noch anpassen, falls sich im praktischen Betrieb herausstellt, dass ein kürzerer Zeitraum sinnvoller ist.

Eigenes JavaScript-Modul für die Pegel
Technisch wollte ich die Geschichte nicht auch noch komplett in die vorhandene app.js stopfen.
Das Projekt ist inzwischen sowieso in mehrere Module aufgeteilt. Radar, Satellitenbild, Wind und Warnungen haben jeweils ihren eigenen Bereich. Das lässt sich auch ganz gut im öffentlichen Wetterradar-Repository auf GitHub nachvollziehen.
Für die Pegelstände gibt es deshalb ein eigenes Modul:
waterlevels.js
Das Modul kümmert sich um den Abruf der PEGELONLINE-Daten, die Auswertung der Messwerte und Statusinformationen sowie um die Marker auf der Leaflet-Karte.
Die vorhandene app.js übernimmt anschließend wieder die Einbindung in die eigentliche Anwendung.
Gefällt mir besser, als am Ende eine riesige JavaScript-Datei zu haben, bei der ich selbst nach ein paar Monaten nicht mehr weiß, was ich da eigentlich veranstaltet habe.
Das Wetterradar wächst langsam weiter
Mit den Pegelständen wird aus meinem kleinen Wetterradar langsam eine ziemlich umfangreiche Karte.
Aktuell kommen dort Daten aus verschiedenen Quellen zusammen. RainViewer liefert das Niederschlagsradar, DWD beziehungsweise EUMETSAT das Satellitenbild, NOAA/NCEP die Winddaten und der DWD die amtlichen Wetterwarnungen. Mit PEGELONLINE kommt jetzt noch die WSV als Datenquelle für Wasserstände dazu.
Und genau das gefällt mir an dem Projekt. Könnte zwar die offiziellen Seiten nutzen, aber das wäre irgendwie zu langweilig.
Ich muss nicht für jede Information fünf verschiedene Webseiten öffnen, sondern kann mir die Daten, die mich interessieren, auf einer Karte zusammenstellen.
Mal schauen, was mir als Nächstes noch einfällt. Irgendwann muss ich wahrscheinlich aufpassen, dass aus dem Wetterradar nicht aus Versehen eine komplette Umweltmessstation im Browser wird.
Wer sich den aktuellen Stand anschauen möchte, findet die Karte unter wetter.larsmueller.net. Der Quellcode des Projekts liegt auf GitHub und kann dort ebenfalls eingesehen werden.
Quellen
PEGELONLINE REST-API Dokumentation – Wasserstraßen- und Schifffahrtsverwaltung des Bundes (WSV)
https://pegelonline.wsv.de/webservice/dokuRestapi
Wetterradar (Leaflet + RainViewer + NOAA GFS + DWD) – GitHub / Happyfeet01
https://github.com/Happyfeet01/wetterradar
Wer mir was in die Kaffeekasse schmeißen will: https://buymeacoffee.com/sly5ir9ov
Wie ist deine Meinung?
Schreib gern einen Kommentar unter dem Artikel oder diskutiere mit anderen im Matrix-Kanal:
#dasnetzundich:matrix.org