River Water Levels & Floodings in Bavaria - Dashboard

Try it out yourself: https://pegelstand-bayern.de/

A data visualization dashboard for visualizing water levels across Bavaria, Germany.
This project displays water level data of the last 70 years from river monitoring stations using different types of graphs, including a 2D map showing the positions of stations and rivers and line charts showing detailed trends.

Project Structure

dataVis_2025_framework/
├── dashboard.html              # Main dashboard interface
├── *Graph.js                   # classes for rendering the specific graphs
├── map.js                      # map visualization logic
├── dashboard.js                # Date and station selection component
├── coordinates.js              # UTM coordinate conversion utility
├── components/                 # UI component classes
├── config/                     # Configuration file
├── data/                       # Processed data files (loaded by the frontend)
│   ├── aggregated-water-data/  # water levels grouped by each year (1 file per year containing data for all stations)
│   ├── *.geo.json              # boundary & cities in GeoJSON format
│   └── hydro-data/             # rivers and lakes in GeoJSON format, in different resolutions, grouped and ungrouped
├── fluesse-wasserstand/        # Raw CSV water level data (only used by preprocessing steps, not required by the frontend)
├── preprocessing/              # scripts to preprocess CSV and GeoJSON data
├── warning_levels/             # Web scraper & preprocessing to get the warning levels
├── services/                   # service for loading the water data (frontend)
└── CSS files                   # Styling and layout

Prerequisites

• web browser
• Node.js (only for preprocessing scripts/ development. All output data is checked into git, because it's a lot smaller than the input data)
• Local web server (so JS fetch does work. We recommend VSC with the "Live Server" extension. Alternatively php -S or python -m http.server $port works fine as well)

Data Preprocessing (Optional)

No npm install required, as we didn't use any external libraries.

cd preprocessing
node preprocess_hydro_data.js
node reaggregate_water_data.js
node generate_daily_averages.js

Additionally to scrape the warning levels; This will take some time:

cd warning_levels
node scraper.js

Data Sources

Geographic Data

• Bavaria Boundaries: deutschlandGeoJSON
• Cities: geojson-world-cities
• Rivers: Copernicus Land Monitoring Service

Water Level Data

• Water levels: Gewässerkundlicher Dienst Bayern (1954 - present)
• Warning levels: Hochwassernachrichtendienst Bayern

For detailed information about data sources and processing challenges, see data-sources.md.