Friday, June 06, 2014

The Creeping Shadow on the Map


Yesterday I was really impressed with the building shadows used in Pints in the Sun. Pints in the Sun allows you to search for nearby pubs and view where the surrounding building shadows will fall during any time in the day.

With the development of WebGL, dynamic map shading and moving shadows are becoming a feature of many interactive maps. The new look Google Maps includes building shadows that reflect the time of the day when you view the map. However Google Maps is not the only map to feature dynamic building and terrain shadows.


OSM Buildings is a pretty awesome JavaScript library for visualizing OpenStreetMaps building geometry on interactive maps. Check out this Building Shadows demo to view an example map which includes 3d buildings and building shadows which are dependent on the date and time of day.

The map includes two slide controls to adjust the position of the sun by the time of day and by the time of the year.


F4map is an amazing 3d map built with OpenStreetMap data. The map includes some incredible 3d buildings, 3d trees and even the water is animated. The shadows on the map are in real-time and reflect the position of the sun and therefore move throughout the day.

My one user tip is to use the ctrl key with the up and down arrow keys on your keyboard to change the angle of the map.


The Shadow Visualization Demo is another impressive demonstration of using dynamic shadows on an interactive map. The map uses OpenStreetMap data with digital terrain model data from Kartverket to provide a terrain map of Norway.

The map includes two slide controls which allows you to adjust the shadow positions and lengths by time of day and by time of year.

No comments: