node.js ko
LiveMap – UlmApi.de
LiveMap – UlmApi.de
by ulmapi.de
“Real-time” visualization of public transportation in the City of Ulm, Germany.
The map shows the movement of select public transportation vehicles in Ulm, Germany. Due to the lack of actual real-time data provided in useable formats, we implemented a tool that generates mock real-time events based on GTFS data sets. Unfortunately, our local transportation authority also lacks GTFS service, so we scraped various sources (i.e., timetables) and generated them on-the-fly.
Judging Instructions
Open the map and watch the vehicles move, preferably in a browser with good JavaScript support and on a decent machine. The heavy lifting is done on the server, but different browsers handle their task with different success (as so often. YMMV.). Please note that the data set is from a smaller German city and we integrated only select service relations. Ulm is not Berlin, so you might encounter times with hardly any transportation service or none at all during the night (Germany is on UTC+2).
Who
berb — Ulm, Germany
cmichi — Germany, Ulm
stkdiretto — ulm
Taxilof — ulm
How
Data Set
- self-scraped GTFS data set
Backend
- node.js
- socket.IO
- express.js
Frontend
- Leaflet mapping library
- bootstrap CSS template
- jQuery
- CloudMade maps
Votes
Your Vote
Voting is now closed.
Other Votes
(72)
samanthaquistjudge
jimpickjudgeSeems like a practical app. It would be nice to have it for Vancouver! :–)
mayumiconjudgeThis reminds me a lot of transportation screens that they have set up in the SF metro system and they can be very useful. it would be helpful to pin point a specific route and to get an approximate time until arrival (similar to NextStop in SF). Also, it would be good to have an icon which shows that there might be a traffic jam or a huge delay. Also, it would be nice to have “alternate routes” if there is a delay. generally think that this is a useful idea but needs a bit more information/data to make it something that I would use on a day-to-day basis
NiDi
contestantI like the look of the app and think that it´s very useful for residents of ulm. The idea isn´t new: Take a look at http://swisstrains.ch/ e.g.
robhawkesjudgeI love GTFS visualisations but I’m a little disappointed to see that this app had to resort to mock real-time events. I’m impressed with the conversion from timetables to GTFS though.
atsuya
contestanti have seen the same thing done for universities, but not city wise. i can’t see this gets spread out to other cities too.
peterlih
contestantLive-maps for public transportation is a very useful use case. So full points here. But there are plenty of real world examples out there for years (Helsinki, Zuerich, Munich, …). It is maybe innovative for Ulm but not with global perspective. The design is okay. I am missing a bit more interaction in the user interface. Bubbles for the stations is not so much … :–(
dmitrydimovjudgeLove it! Even if it’s not actual location data but extrapolated from schedules but it’s Germany so the buses are probably moving exactly as you show them. Just for the heck of it I tried it on the iPhone and it works! I want this in San Francisco so I can catch a train.
nelsonkchengjudgeThis is very cool. I hope this app or something like it becomes a reality for all cities in the future!
Design looks good, there’s a lot of utility (should I get a ride or just wait until the next bus?), and I can clearly imagine how other cities might implement it. (I’m just thinking how awesome it would’ve been in NYC when trying to time subway trains.)
zapnapjudgeGrabbing the transit system data and then using it to display approximated real-time transit info is pretty clever. It’s really too bad you couldn’t get access to actual data. If you could, a service like this would be a great way to see when/where the next train or bus is coming. Especially in a mobile context, this could be an indispensable tool. Props to you for doing something practical :).
In a larger city (where realtime data is available), would be cool to allow people to check in when they’re on a certain transit line too, so you can see who else is traveling with you, or when/where your friends are (if they’re running late, etc). Alright, so probably not super practical but cool.
ryanmcgrath
judgeThis. Is. Awesome.
It does everything I expected it to do going on, and the design is easy on the eyes and totally usable.
This is something that, if it were available in my area, I would totally see myself using on a daily basis. I encourage you to run with this after Knockout is done. ;)
_kamzillajudgeI can see how this would be useful to those who rely on public transportation. The one feature I wish it had would be a way to filter out certain bus/train lines.
SteveStrezajudgeI love the presentation of this. It removes a lot of clutter and just shows a giant map. I did have problems figuring out how to zoom out, and found no onscreen controls. Also, when I clicked a bubble, and the bus moved, the bubble did not move with it, which seemed strange. In any case, this is a great demonstration of what node.js and client-side JavaScript can do, and hope you keep working on it!
mranneyjudgeI like the clever way of converting non-realtime data and making it seem realtime, as well as the scraping techniques. The visual design is very clean and pleasing to the eye.
Even if this was data for my own city, it seems like there’s a missing element of usefulness here. The actual mapping of transit locations and vehicles works precisely as intended, but something is missing for me that would make it more useful. Perhaps being able to use/set a location and find out when the next bus would arrive or an indication of how early/late the various vehicles are.
AnkurBulsarajudgeI think this would have been better executed in a mobile context. The ability to see live public transport is more useful when you’re out and about than behind a desk. Also on a large map, with a zoomed out view, the realtime-iness of it gets diminished and provides questionable value.
But I do think the concept is sound and this type of realtime transportation view is coming soon.
voodootikigodjudgei have wanted something like this forever. <3 I believe that attaching to a live data stream would make it far more effective (hence the completeness -1) Could use a “arriving in” estimated time based on trajectory for the upcoming station on hover event.
ssorokajudgeBest project I’ve seen so far. Well done.
MEgrez
contestantMarvellous!!! However there’s no interactions..
therazorbladejudgeThis would be much better as a mobile app with focus on just the transit lines you care about or stop nearby. Showing it on the map is not that useful, but helping people actually get on the next bus is.
yojimbo87
contestantCoreh
contestantThis is just great. The other day I was talking to a friend about how something like this would be awesome for our city. (Belo Horizonte) It’s a shame you guys couldn’t get access to the real data feed. :–(
A service like this with real data would be incredibly valuable when on the go.
lc0
contestantInteresting idea with good implementation.
travhimself
contestantExcellent idea, and incredibly useful. I would have LOVED to have this when I lived in DC.
linus
contestantWhile it would be much more interesting and valuable if it was real time data, it’s a cool idea.
Kudos for using openstreetmaps.
The different modes of transportation should have different colors IMO – that would be more interesting to watch, and easier to tell them apart. Also, highlighting each bus'/train’s route and start and end point on hover would be valuable.
I also seemed to have some issues connecting – it took a couple of minutes before the actual buses and trains appeared.
waxpancakejudgeUnfortunate that you didn’t use a city that offers real-time public transit data. People would love this here in Portland, Oregon. Great concept, well-executed, but as-is, isn’t actually useful since the data is fake. But great proof-of-concept design.
astro
contestantSeen something like this before for a swiss city.
raoulmillais
contestantVery impressive. I love the look and its super useful. It has been done before elsewhere though.
airportyh
contestantjoaomilho
contestantSuper useful… how do you get the positions? It’s a public service in your town?
One of the best entries so far.
DamonOehlman
contestantReally slick implementation guys.
Nice! This seems like it would be useful for new residents of Ulm and visitors to Ulm. It’s nicely designed and fun to watch. The color contrast makes it easy to read and interpret and the intuitive navigation (double click to zoom etc) works nicely too. Some of the details are a little confusing (eg. the light blue vs dark blue line’s meanings) so a little key or hover functionality might be nice. But overall it looks good and is intuitive. Great job! Any chance any US cities are on the roadmap for similar maps? ;)