Skip to main content

Timeline Maps with googleVis & Twitter Bootstrap Carousel (& updated Slidify)

I've wanted to create timeline maps with interactive googleVis Geomaps for a while. These would be a nice way to quickly show the spatial distribution of some data over time.

It turns out that it's pretty easy to do with a plugin for Twitter Bootstrap called Carousel. Carousel is probably intended for regular picture slide shows. But because it can hold iframes, it can pretty much include anything, even interactive maps.

Here is a short slide show with examples and code for how to combine googleVis and Twitter Bootstrap Carousel to create interactive timeline maps.

Note: I used the newest version (0.3.1) of Ramnath Vaidyanathan's Slidify to create the presentation. He is really putting a lot of good work into that package. I especially like the choice to set the default slide framework to Google's I/O 2012 style. It has many features you don't find in other HTML slide frameworks. Particularly useful here, it begins to load iframes when you are on the previous slide rather than waiting until you get to the slide with the iframe.

Code:
  • Code for the example website with a googleVis Carousel timeline map shown in the presentation.
  • Code for the presentation on GitHub. (Note: the code I used to 'Slidify' the presentation is virtually identical to Ramnath Vaidyanathan's example.
Update (16 Nov. 2012): Ramnath Vaidyanathan has created a great demonstration of how to use the whisker package to include this timeline map directly into Slidify slides.
Labels:

Comments

Markus said…
Great post and I really like the new Slidify look!

I had some luck with creating animated geo charts using googleVis and a bit of JavaScript. You find an example and code in the following post from March 2012:
Changes in life expectancy animated with geo charts

Thanks for sharing!
20:46
Unknown said…
Nice, I added your post to the presentation.
00:25
Erin said…
Hi Christopher!

Where is the code, please?

Thanks,
Erin
03:36
Unknown said…
Hi Erin

All of the code is linked to in the presentation, but it is probably a good idea for me to highlight it in the post.

Updating . . .
04:23
Post a Comment

Popular posts from this blog

Dropbox & R Data

I'm always looking for ways to download data from the internet into R. Though I prefer to host and access plain-text data sets (CSV is my personal favourite) from GitHub (see my short paper on the topic) sometimes it's convenient to get data stored on Dropbox . There has been a change in the way Dropbox URLs work and I just added some functionality to the repmis R package. So I though that I'ld write a quick post on how to directly download data from Dropbox into R. The download method is different depending on whether or not your plain-text data is in a Dropbox Public folder or not. Dropbox Public Folder Dropbox is trying to do away with its public folders. New users need to actively create a Public folder. Regardless, sometimes you may want to download data from one. It used to be that files in Public folders were accessible through non-secure (http) URLs. It's easy to download these into R, just use the read.table command, where the URL is the file name
51 comments
Read more

Slide: one function for lag/lead variables in data frames, including time-series cross-sectional data

I often want to quickly create a lag or lead variable in an R data frame. Sometimes I also want to create the lag or lead variable for different groups in a data frame, for example, if I want to lag GDP for each country in a data frame. I've found the various R methods for doing this hard to remember and usually need to look at old blog posts . Any time we find ourselves using the same series of codes over and over, it's probably time to put them into a function. So, I added a new command– slide –to the DataCombine R package (v0.1.5). Building on the shift function TszKin Julian posted on his blog , slide allows you to slide a variable up by any time unit to create a lead or down to create a lag. It returns the lag/lead variable to a new column in your data frame. It works with both data that has one observed unit and with time-series cross-sectional data. Note: your data needs to be in ascending time order with equally spaced time increments. For example 1995, 1996
46 comments
Read more

A Link Between topicmodels LDA and LDAvis

Carson Sievert and Kenny Shirley have put together the really nice LDAvis R package. It provides a Shiny-based interactive interface for exploring the output from Latent Dirichlet Allocation topic models. If you've never used it, I highly recommend checking out their XKCD example (this paper also has some nice background). LDAvis doesn't fit topic models, it just visualises the output. As such it is agnostic about what package you use to fit your LDA topic model. They have a useful example of how to use output from the lda package. I wanted to use LDAvis with output from the topicmodels package. It works really nicely with texts preprocessed using the tm package. The trick is extracting the information LDAvis requires from the model and placing it into a specifically structured JSON formatted object. To make the conversion from topicmodels output to LDAvis JSON input easier, I created a linking function called topicmodels_json_ldavis . The full function is below. To
22 comments
Read more