Revolutionary Scrollbar Map Control

The Twin Cities Storm Ready Map is an interesting Google Map showing the time-line of a simulated tornado storm hitting Minneapolis–Saint Paul.

The map, created by Minneapolis Public Radio, shows the likely effects of a tornado hitting the Twin Cities. The simulated effects of the storm are partly based on asking people along the path of the simulated tornado what their preparations for a storm are.

The map itself features a really clever time-line control. To navigate through the time-line the map user just needs to use the browser scrollbar. As the user scrolls down on the page the Google Map stays stationary in position on the page but the sidebar scrolls down the time-line and the map updates to show the scenario for that part of the simulated storm.

This is the first time I've seen the browser scrollbar used to control a Google Map. Somehow I don't think it will be the last, as it is a very effective method for presenting a time-line on a Google Map.

The History of the USA on Google Maps

The History Engine is an educational project from the University of Richmond that is creating a collection of historical articles about life in the United States throughout its history.

The History Engine includes a Google Maps based time-line that allows users to explore the project's history articles by date and by location. If you select a decade from the time-line states that have essays available from that decade are highlighted on the map.

If you select a highlighted state the available essays can be accessed by clicking on the map markers that appear on the map.

Via: @geoparadigm

Timelines, Tweening & Temporal Heat Maps

Timemap is a JavaScript library to help add a SIMILE time-line to an online map, including Google Maps. The library includes a number of sample maps that show how you can use the SIMILE time-line with Google Maps. Two of the examples I haven't seen before and both maps are impressive in their own right.

The Temporal Heatmap from a Google Spreadsheet example is a map with markers that are sized on the map according to a data point in the spreadsheet. It is a great template for showing expanding and shrinking data points over time. In the example map the markers show cumulative deaths from asbestosis and silicosis in Texas over time.


The other example is On-the-fly Polygon Tweening. This map tweens a polygon so it grows and shrinks in conjunction with the time-line control. Polygon tweening could be used for any number of map based visualisations, for example to show a changing city boundary other time.

The Latest Earthquakes on Google Maps

The Ö-Files - Live Earthquake Map uses Google Maps and the Simile Timeline with a number of data sources to provide a live map of earthquakes around the world.

The map is updated every five minutes to show the latest reported earthquake and you can use the time-line to explore earthquakes over the last seven days. It is also possible to refine the results shown on the map based on the different data sources.

_________________

The Amsterdam of Anne Frank

Everything about the Het Amsterdam van Anne Frank time-line is beautifully realised, including its use of static and interactive Google Maps.

The time-line explores the history of Amsterdam before and during German occupation in World War II. The time-line includes excerpts from Anne Frank's diary alongside historical photographs and videos of Amsterdam during the occupation.

If you click on an entry in the time-line it will open in a lightbox style window. Most of the entries are geo-located using a a static Google Map. If you click on the static map a larger Google Map will open to show the entry's location in Amsterdam.

_________________

A Time-Line Library for Google Maps

Time-Map is a Javascript library for Google Maps that adds a fully functioning time-line to a Google Map.

The time-line element includes three different time sliders that allows the user to change the year, month or day. As the user drags the time-line the markers are automatically updated on the map.

The same developer has also provided a number of frameworks for creating custom information windows, styled maps, draggable driving directions and custom map markers. You can see examples and download the libraries here.

_________________

DHO: DIscovery

Ireland's Digital Humanities Project is using Google Maps and the Simile Time-Line as a way to browse Irish digital collections and resources.

You can select to view a collection from the drop-down menu. Once you have selected a collection you can choose to browse the collection in a Google Maps view or on a time-line.

The map view obviously depends on whether location data has been added to individual collections.

DHO Discovery Interface

_________________

Make Your Own History Map

Weaving History from the Open Knowledge Foundation lets you create your own history maps with a little help from the Simile Timeline and Google Maps.

The Simile Timeline widget has long been a favourite tool for Google Maps developers who want to create maps about historic events. The programming skills required for both the timeline widget and the Google Maps API however does create a barrier for anyone who hasn't got the necessary knowledge of javascript.

With Weaving History you can create your own historical timeline and map without any programming skills. To create a new timeline map you just need to start a new 'thread' on Weaving History and add some relevant 'factlets'.

When adding factlets you can just add the URL of a Wikipedia article and the factlet is added automatically. As you add factlets to your thread they are automatically added to your thread. It is as easy as that.

Add a few factlets to a thread and you soon have your own historical timeline map.

Weaving History

_________________

A Google Map of the American Civil War

Washington Post Civil War Map

I do like my history served up on a nice map. And this is a very nice map!

The Washington Post's Google Map of the Civil War maps all the battles and casualties of the American Civil War. The map features an animated time-line that allows you to watch the war unfold over time. You can pause the animation at any time and you can also refine the view to show any period of time.

If you roll over the circles you can view the date and the casualties of the mapped battle. If you click on the circle you can read a more detailed account of the battle. There were a lot of battles and a lot of casualties in the Civil War so obviously a lot of work has gone into creating this map!

A lot of effort and an awesome map.

Also See

• The American Civil War Timeline Project

________________

The Victorian Bushfires on Google Maps

Black Saturday

The bushfires of 7 February 2009 were the worst in Australia's history. The Australian Broadcasting Corporation has created an amazing Google Map to tell the stories of the Victorian bushfires by those that actually experienced it.

ABC has collected hundreds of accounts of the day and the fire's aftermath from residents of the fire-affected communities, volunteer fire fighters, journalists, politicians, tourists and others. This Google Map allows users to browse these stories, videos and photographs by location and by time.

The timeline allows you to browse the submitted stories on the map by time. The initial view allows you to select any range of time from the 7th and 8th Feb 2009. If you select the next button you can also select a time range from the days, weeks and months after the fires.

All the multi-media content can be viewed directly from selecting the markers shown on the map.

________________

Flickr Time-Line Google Map

Flickr Time Photolayer

This is an interesting mashup of Google Maps and Flickr using the SIMILE Widgets Timeline component.

The map allows the user to view Flickr images for any location in the world. If you don't like the latest photographs for your location then you can use the time-line above the map to view Flickr photographs uploaded on different dates.

This addition of the time-line means that you can search for photographs for particular locations on specific dates, such as Washington on the day of President Obama's inauguration or Greenwich Park on the day of the London Marathon.

________________

Protovis Visualisation Tool & Google Maps

The Stanford Visualisation Group's 'Protovis' is an open source graphical tool for visualising data. The Protovis website includes a couple examples of the tool using Google Maps.

Minard's Napolean

Charkes Minard was a pioneer of the use of graphics in engineering and statistics. Probably his most famous creation was a flow map showing Napoleon's disastrous Russian campaign of 1812. His map displays:

• the army's location and direction, showing where units split off and rejoined
• the declining size of the army
• the freezing temperatures during the retreat

The Protovis map of Minard's visualisation of the Russian Campaign adds interactivity using Google Maps.

The timeline below the map shows the date and the temperature as Napolean travelled east towards Moscow. The brown line shows the dwindling size of his army and the black lines show where units split off and rejoined the main army.

Oakland Crimespotting

This Google Maps mashup shows crime in Oakland. The coloured circles correspond to crimes. The different colours represent different categories of crime.

Both the Minard Map and the Oakland Crime map have the source code and the data source displayed under the maps.

________________

Timelines on Google Maps

World War Two Timeline Project


The World War Two Timeline Project is an interesting attempt to chronologically and geographically map the events of World War Two using the open source Simile Timeline. The site has recently added Wiki style editing to the map. Registered users can now add geographic/chronological data points to the project.

The site now also has two other historical time-line maps:

The American Civil War Timeline Project
The Napoleonic Wars Timeline Project

With all three maps, historical events are added to the map when you use the time-line interface above the map.

________________

Share Your Life on Google Maps

thisMoment

thisMoment is a website allowing users to capture, both as individuals and in collaboration with family and friends, meaningful moments in their lives. Users can sequence those moments on a personal timeline, creating a 'digital reflection' of their real-world life. The site can combine photo and video sharing, blogging, media and social networking to create a personal album of important events in your life.

Each moment created comes with its own small Google Map showing where it happened. The map comes with an 'enlarge map' link that will open the map full screen in a lightbox window. The enlarged map also shows moments created by other users that have happened nearby.

_________________

The Guilty Pirate Bay Map

Dipity Pirate Bay Timeline

Dipity have produced an interesting time-line of Pirate Bay. The Dipity time-line widget includes a Google Map option which allows events to be plotted geographically as well as chronologically.

The map includes a 'play' option which animates through the events on the map. In this case the animation works backwards. It starts with today's guilty verdict and works backwards to 2003 and the creation of the 'Bureau of Piracy'. I guess the four co-founders of The Pirate Bay might be wishing that it was so easy to turn back time.

Via: The Guardian

_________________

View World War Two on Google Maps

World War Two Timeline Project

The World War Two Timeline Project is an interesting attempt to chronologically and geographically, map the events of World War Two using the open source Simile Timeline. Using the map it is possible to view the major events of World War Two on a Google Map.

You can use the timeline, at the top of the map, to plot the progress of the war on the map. It is also possible to navigate the events of the war via tags. These tags include countries as well as subjects such as naval, aerial and land. The map creators say they have not finished adding data, so this map should become an even more useful resource over time.

Also See

TimeMap and Other Timelines

________________

TimeMap & Other Timelines

One of the most frequent questions I get asked by readers of Google Maps Mania is whether there is an easy way to create a Google Maps mashup with a timeline. It seems that lots of you want to create maps that show developments over time.

The Google Maps API itself does not contain a timeline but that does not mean you cannot have a timeline with your map. Nick Rabinwitz has created a Javascript library called TimeMap that lets you use the Google Maps API in conjuction with the Simile Timeline API, alternatively you could use a third party map creation tool like Dipity to create a timeline map, or, if you have the development skills, you could create your own timeline interface to work in conjunction with Google Maps.


TimeMap Javascript Library

The Google Geo Developers Blog last week carried a post by Nick Rabinowitz, who is the creator of TimeMap, a Javascript library that helps the Google Maps API work with the SIMILE Timeline API to create maps and timelines that work together.



There are a number of examples of maps using the Simile Timeline API. In the post Nick used the Google Maps API Birthday Timeline as an example of a map using his library. This map created a timeline of all the Google Maps feature updates in its first three years of its existence and also mapped all the posts from Google Maps Mania.

One of my favourite maps Ushahidi's Kenya Incident Map also uses Nick's TimeMap library to create a timeline tracking and mapping reports of incidents of violence around Kenya.

Of course you don't have to use Nick's library to use the Simile Timeline. Olivier G has used the Simile Timeline to create a biographical map called Map My Life. Olivier has created a 'life player' which animates the timeline. Therefore users can just press play and watch Olivier's life flash by on the timeline and on the Google Map.

Map My Life will even let you create your own biographical map. To create your own biographical map write an xml file with the data of your biography and then just load it onto the map.

Third Party Creation Tools

Dipity is a good example of a third party site that allows users to create widgets with maps and timelines. The created timelines can then be embedded in a website or blog.

Using Dipity it is possible to show the progress of a subject both chronologically and geographically. You don't need any programming skills to create maps in Dipity and anyone can create a timeline map very quickly using this widget.

The payoff of course is that you have no freedom with the look and feel of the final map. Using Nick's TimeMap library requires some knowledge of coding but the reward is you have much more flexibilty over the design of your map.

Create your Own Timeline

The third option for developers is to create your own timeline interface with Google Maps. This of course gives developers the greatest freedom but is also the hardest option. Not surprisingly the best independently produced timeline maps have come from those who have been able to spend a bit of money on development.


The Washington Post's TimeSpace World is a very good example of a custom made timeline map. A timeline at the bottom of the Washington Post map illustrates peaks in coverage and allows users to customize news searches to a specific day all the way down to a particular hour.

What Was Here, a map showing 1000 years of Liverpool's history, is another good example of a map with a timeline. This timeline covers 1000 years of history so its conception and inception obviously required some thought.


So, if you want to create a Google Maps mashup with a timeline you have three main options. The easiest method is to use a third party creation tool like Dipity. If you have some development skills you could use the TimeMaps Javascript library. However if you want to have complete freedom over your map's design you need to get your hand's dirty and start playing with the Google Maps API.

________________

Dipity

Dipity
Dipity allows users to easily create timelines on any subject. The created timelines can then be embedded in a website or blog. That in itself would be a reason for great cheer but Dipity also allows users to geo-tag the events on a Google Map. It is therefore possible to show the progress of a subject both chronologically and geographically. For example, you could show the progress of the Lewis and Clark expedition in a timeline and on a Google Map.

That's not all, Dipity have also accessed the API's of Flickr, YouTube, Digg and a number of news sources to allow you to create mapped timelines of photos, videos, Digg posts and news stories.

Tickr
Tickr allows you to build a timeline of Flickr photos for a particular tag. Users can use the timeline to see when and where images for a given keyword, tag or Flickr user were taken.

Here are some geo-tagged Flickr photos of last weekend's Red Bull Air Race in London:



TimeTube
TimeTube allows you to build a timeline of Youtube videos for a particular tag. Here is a TimeTube of Google Maps related videos:



Newsline allows you to build a mapped timeline of a particular news story and Archaeologist lets you build a timeline of Digg posts for a particular keyword.

Simile
Simile is another timeline builder that it is possible to combine with Google Maps. The Google Maps team created this comprehensive Google Maps Mania timeline showing all the posts over the years from this blog. It is an amazing example of what can be created using Simile with Google Maps.

To use Simile with Google Maps you will need a working knowledge of the Google Maps API. Dipity on the otherhand requires no development knowledge. So, if you want to map a timeline, choose Dipity for simplicty and choose Simile if you want more control over the design and features.

_________________