So, I want to contribute a public transportation route that I know to OSM. It’s a little bit hard, but it’s completely doable by using JOSM. Done.

Next? I want to see all the available bus route that already exist on OSM.

So, I made this : altilunium.github.io/bisangkot

It’s pretty much straightforward. Download the route by using Overpass API, convert the downloaded OSM data into the geojson format, display it by using leaflet, then add a little interactivity control, such as “hover to display the route’s name” and “click to focus the route”.

For this one, I queried the Java island only. You can query other region by using this script. Just change the bbox settings on line 32. Then, convert the downloaded OSM data into the geojson format by using this python script that I made.

The conversion is pretty much straightforward, except this “jitter” function.

You know, a single road may contain several route. This condition could confuse Leaflet js, causing the misfirings of onClick and onMouseover event. So, to fix this problem, I try to separate each route as a single geojson line. Every route that crosses a same road will be moved slightly to random direction and random distance from the original coordinate. This simple trick somewhat solved the problem quite well.

Okary. Now, what next? Maybe, encourage more people to add new public transportation route data, I think. Improve both the data quality and quantity. Or perhaps, let’s make a route finder apps (how to reach point A to point B by using public transportation).