Monday, June 13, 2022

Data Spiders

Hub and Spoke is an interactive map which shows you the eight closest airports from any location on Earth. 

Click anywhere on this map and turf.js is used to draw lines from that location to the eight nearest airports. Obviously this map will be invaluable to anybody who is desperate to know where their nearest airports are located. However, to be honest, I think most people are going to use this map to pretend that are they are in control of a massive alien spider roaming the Earth. 

This is because as you move the Hub and Spoke map the eight-legged airport finder crawls across the map to your new location. As it moves it continues to update and find the eight nearest locations. The result is (as you can see in the animated screenshot above) like being in control of a massive spider from outer space!

As a matter of interest Hub and Spoke also uses Mapbox GL's new Globe projection view. I don't think that the new globe projection is as yet officially documented in the Mapbox API. However if you check out the code of Hub and Spoke you can see that the globe projection works if you use the v2.9.0-beta release of the Mapbox GL API.

The eye-catching effectiveness of Hub & Spoke has very quickly inspired other map makers to create their own animated maps. Garrett Dash Nelson has responded to Hub & Spoke with his Massachusetts Libraries Spoke Map. Move the cursor around on this map and a ten legged spider moves around the map showing the ten closest libraries to the cursor position (as the name implies this map only works in Massachusetts.

John Wiseman was inspired to create Runways.Runways shows you the nearest airport runways which align with the direction of movement of your mouse. As you move the cursor around the map you can see all the runways around the cursor that are aligned with your direction of movement. This map uses the runway data from the amazing Trails of Wind interactive map.

And - to get us back to spiders - Darren Wiens has tweaked the original Hub & Spoke map in order to create an even more frightening spider. His Spoke Spider map uses a bigger circle for the 'hub'. The effect is a map with a bigger and more threatening creepy-crawly.

The Closest Hill Map introduces something new to the data spider theme - namely a menu. Like the other maps on this page the Closest Hill Map uses a hub and spoke system to show the closest points to a chosen location. However the Closest Hill Map allows you to choose which data you want the spider to crawl. In this case you have a choice of which types of Scottish hill you wish to see visualized on the map (Munroe, Corbett, Graham or Donald). 

 The Closest Hill Map also introduces a number of user control options which effect how the data spider moves on the map. 'Center of map' allows you to simply drag the map around and the data spider will remain in the center of the map and update to show the ten closest hills to the changing location at the center of the map. Select the 'Follow mouse' option and the data spider will follow your mouse around the map, showing the closest hills to the location beneath the cursor. The 'Click' option simply moves the data spider (or the hub) to the location that you click on.

No comments: