I am working on my GSoC project, that is providing support for vector tiled data in OSM iD editor, for about a month now. Initially, there was a lot of reading about how the map is rendered on a screen from geojson data, how are raster tiles and vector tiles different, various formats of vector tiles and much more!!
First step in the project
The first step towards supporting vector tiled data is that a user can add a URL to a vector tile and have the vector tile shown up on the screen. Currently, it will support .pbf(Protocolbuffer Binary Format) and .mvt(Mapbox Vector Tiles) format. For those who are new to vector tiles, .mvt and .pbf contain data of a particular tile. They look something like this : These tiles can have various sets of data like name of cities, or train stations etc. The goal is to draw the data of these tile on iD and it should show up on the screen like this :
These files contain data in Protocolbuffer binary format which is converted to geojson data and this geojson data is passed directly to the D3 draw functions to show up the tiles on the screen.
vt2geojson is great for changing vector tiles to GeoJSON from remote URLs or local system files but it works with Node.js only. For iD we’ll be using mapbox’s vector-tile-js, it read Mapbox Vector Tiles and allows access to the layers and features, these features can be further converted to geojson.
The next step would be working towards .mbtiles, these files contain data for more than one tile.