Berlin subway map, animated

Antoine Clausse

Last update: Dec 20, 2022

Overview

Ubähnchen

ubähnchen.vercel.app

An animated live map of the Berlin U-Bahn.

How it works

Planned mode

Schedules are extracted from the GTFS data of the VBB which contains the arrival time and departure time for a time period of several months. The movement of the train is simulated at constant speed between stations.

The GTFS data is currently manually updated, so it is constantly lagging a few days behind latess updates from VBB.

Live mode (beta)

Mandatory stuff: "Powered by VBB GmbH. All information without guarantee."

The HAFAS API has a “radar” endpoint, giving the position of all trains and some animation data, containing stops information (origin, target, time) and a proc value, which I think means "position between 2 stops in percent". So I'm using that to place trains on the map.

Unfortunately, there are some implementation mistakes from me, causing trains to move weirdly or disappear.

Maps

The U-Bahn map and S-Bahn+U-Bahn maps ( CC BY-SA 4.0) are taken from Wikipedia and modified. In particular, the paths for the lines needed to be made continuous, instead of being many disjoint portions.

Animation

The display and animations is made with paperjs.

Thanks

Jannis R for his libraries and documentation that were very helpful to build this project.
VBB for publishing the data and having APIs that are necessary for this project. And also for running the trains.

Development

Setup

⚠️ Many steps are certainly missing. Please don't hesitate to open issues or PRs before you get frustrated with this.

yarn install
yarn build in the gtfs-loader package. This should:
- Download the files from VBB in the ubahnchen/GTFS folder.
- Filter out transportation modes that are not in use yet (bus, tram, boat...).
- Save all relevant values in a SQLite database
Run the unit test. They validate the data.
yarn dev in the ui package.

Things I like to look at in the future

The timezones are probably not handled properly. Please make sure you are in CET before running yarn build 😄

MERN stack application which serves as an online map journal where users can mark and rate the places they've been to.

PlaceRate PlaceRate is a MERN stack application which serves as an online map journal where users can mark and rate the places they've been to. You ca

May 17, 2022

generate a map server side and save/return it as png image

NFT map generator Request a new map to be generated with latitude and longitude params, for example http://localhost:3000/maps?lat=45.3579&lng=9.4427

Jul 12, 2022

Look up a city and get back weather forecast for searched city and top News headline related to that city and an interactive map which shows the location of that city.

WeatheredVibes Description As a user I want to look up a city to get the current weather and suggested current news articles based on the location sea

Mar 12, 2022

A command-line tool to convert Project Zomboid map data into Deep Zoom format

pzmap2dzi pzmap2dzi is a command-line tool running on Windows to convert Project Zomboid map data into Deep Zoom format. Features Supports both python

Dec 31, 2022

🗺 A map of OSINT tools.

🕵 ️‍ Malfrat's OSINT Map 🗺 Available here ! Malfrat's OSINT Map is an online tree of selected useful tools made for OSINT purposes, made to help you

Dec 30, 2022

Map of reception points for refugees near Polish-Ukrainian border

ua-2022-map Map of reception points for refugees near Polish-Ukrainian border work in progress... Development We provide a docker-based dev environmen

Dec 7, 2022

An application to map out game reserves using aerial photography, intelligent image stitching and AI driven recognition focus.

Map Out Game Reserves Using Aerial Photographs An application to map out game reserves using aerial photography, intelligent image stitching and AI dr

Sep 29, 2022

A Hackable Markdown Note Application for Programmers. Version control, AI completion, mind map, documents encryption, code snippet running, integrated terminal, chart embedding, HTML applets, plug-in, and macro replacement.

Yank Note A hackable markdown note application for programmers Download | Try it Online Not ecommended English | 中文说明 [toc]{level: [2]} Highlights

Dec 31, 2022

Map over an object in a preorder or postoder depth-first manner

obj-walker Walk objects like this guy. Map over an object in a preorder or postoder depth-first manner. Also, provides functions for serializing and d

Jun 2, 2022

Comments

City selection

As I plan to add more cities to Ubähnchen, wonder how the UX should be.

Landing screen

I wonder if the first page the user sees should be a city selection or the Berlin U-Bahn. I think I prefer showing Berlin first so users immediately see the fun part of the website, but maybe it will be hard to make it visible that other cities are selectable?

City selection

Here are a few ideas...

Copy Minimetro

Map of Europe (or the world, later)

A map in which the user can see available cities and can click on them to see the transport system

Other

Do you have better ideas?
enhancement help wanted design

opened by lzear 2