Using Aerial Images as Background for the OpenStreetMap iD Editor

We’ve been experimenting with using OpenStreetMap to map some of the rural Bedouin communities in the Negev desert. These are places where a lot of the construction is made of light materials, not easily discrened in a low resolution image and often changing – on top of which, the default satellite images are patchy and not the most amazing quality:

The default background satellite image

We managed to get more recent aerial photos with better resolution, in TIF+TFW files (the method below works for other world files as well, JPW etc). The trick was to convert it to a background tile map. That was simple enough with gdal2tiles: -s EPSG:3857 -v source/chura1.tif tiles/

Now we’ve got a whole lot of tiles, but we need to serve them from somewhere. Tiles are just a bunch of small static files — I’ve already discovered GitHub Pages is a zero cost and extremely scalable solution for serving them. I created a repo hura_tiles (Hura is the name of the town we’re mapping) and added the new /tiles directory:

git checkout -b gh-pages
git add tiles
git commit -am "add tiles"
git push origin gh-pages

We’re good! All that’s needed now is to is to tell iD to use a custom background layer, and set the URL:{z}/{x}/{-y}.png

And here we are. Below are images of of the default and new backgrounds, can you spot the difference?

Since doing this, I’ve learned that this is a pretty common issue when speaking with local municipalities. Seems like pretty much all of them (at least here in Israel) have very good aerial images that are much higher resolution than the satellite images, so being able to use them is a critical need, rather than just a bonus as we initially assumed.