CityTank: Real‑Time Fuel Price Map for Berlin
Empowering drivers with live fuel data, price trends, and navigation
Never overpay for fuel again
CityTank is an open‑source, interactive geovisor built with OpenLayers and Chart.js that displays real‑time fuel prices from the Tankerkönig API. It helps drivers in Berlin find the cheapest gas station nearby, compare prices, and navigate there effortlessly – all in a sleek, mobile‑friendly interface.
✨ Key Features
- Live price updates – stations are refreshed every 5 minutes for a 5 km radius.
- Intelligent color coding – markers change from green (cheaper) to red (more expensive) based on the selected fuel type (Diesel, E5, E10).
- Cheapest station highlight – a rotating gold ring makes the most affordable gas station stand out.
- Zone statistics – see the average, minimum, and maximum price in the current view.
- Historical trend chart – a small line chart shows the last 30 days of average fuel prices in Germany.
- Global oil context – displays the current Brent crude price and its daily change.
- Geolocation – center the map on your location with a pulsing blue dot and a subtle red buffer.
- City search – jump to major German cities using a dropdown list.
- Animated routes – click “Show route on map” in a station’s popup to see an animated path (red line with a moving dot) from your position to the station, powered by OSRM.
- One‑tap navigation – the popup also includes a button that opens Google Maps with direct directions.
🛠️ Technology Stack
- OpenLayers – for all map rendering, layers, and interactions.
- Chart.js – for the lightweight historical price graph.
- Tankerkönig API – real‑time fuel price data (CC BY 4.0).
- OSRM – driving route calculation.
- Nominatim (OpenStreetMap) – geocoding for city search.
- Trading Economics – Brent crude oil price reference.
🚀 Try CityTank live
The application runs entirely in your browser – no installation needed. Use the embedded demo below or open it in a new tab:
Data Sources & Attribution
Real‑time fuel prices: Provided by Tankerkönig under the Creative Commons Attribution 4.0 International (CC BY 4.0) license.
Map data: © OpenStreetMap contributors.
Routing: OSRM – open source routing.
Oil price: Trading Economics – Brent crude reference.
Historical chart data: illustrative demo values; for production a dedicated API would be used.
CityTank is an open‑source project. You can find the code, contribute, or report issues on GitHub.