Tuesday, February 02, 2021

The Bendy Video Map

Both Mapbox and Leaflet.js include options which allow you to overlay videos on top of an interactive map. Mapbox's raster layers and Leaflet's L.VideoOverlay class both make it very easy to add playable videos on top of the satellite imagery (or road map) of the location shown in the video. This is particularly useful if you want to add animated timelapse satellite images or show drone captured video on a map.

Now that Mapbox has the option to Add 3D Terrain to the Map you can now also drape a video layer over a curved 3D terrain.For example this Lombard Street Video Map overlays drone captured video of cars driving on San Francisco's most famous winding street. Because the map also uses Mapbox's 3D terrain when you adjust the 'pitch' of the map the video twists and bends to fit the underlying height of the sloping street. 

The Lombard Street Video Map is just one of a number of fun and interesting experimental maps which have been made with Mapbox's new 3D elevation data. You might also like: 

No comments: