Feedback Needed: Interactive map demo

23 August 2012 6

skip to the demo…

As with the network diagrams discussed earlier, geographic data can often benefit from the ability to be explored in an interactive manner. The World Bank has many statistics on a per country basis as do other organizations. The CIA World Fact Book also has many statistics like this useful listing of literacy broken down by gender.

After converting the above data to tabular form, it was possible to produce a map with each country shaded according to one attribute (such maps are called choropleth maps). These can be produced as static images with desktop software including the commercial application arcGIS or the open-source alternative qGIS. The CIA literacy data, however, has three statistics per country: total literacy, male literacy, and female literacy. With static images, it could be possible to show these three statistics on three separate maps or to use shading with a bar chart on top of each country. Neither of these solutions is ideal, however. Separate maps are sometimes difficult to compare, while the use of bars for every country quickly makes the map too crowded. On the earlier static image of this data shown below, we compromised by including the break down by gender for only some countries.

Literacy and Gender

The static image, however, is less than ideal. Exact numbers and gender breakdowns are only available for a small number of countries that the authors selected. In addition, the colours of the smallest countries are harder to see. So, whether it’s literacy, internet usage, income, tweets, Wikipedia edits, or another statistic, interactivity is a key way to allow the user to get exact numbers, view smaller countries, and see a break down of additional information for every country. The additional information in this example is male and female literacy shown with bars, but it could be a line plot showing change over time or text information.

So, without further ado please find below a demo visualization of what we’d like to allow users to produce and customize with a future web-based wizard. We’ve tested this visualization in the latest versions of Safari, Firefox, Opera, and Chrome on Windows, Linux, and Mac, but we consider it to be very much a work-in-progress. We’re releasing it to get feedback that we can incorporate into the project. The more specific you can be in describing any suggestions or issues the better. Please at a minimum include your operating system (Windows, Mac, Linux) and browser version.

So, please leave feedback! What works, what’s missing, and what would you ideally change? In addition, what options need to be supported for the right side pane besides bar charts? Leave a comment below or send an email.

Demo 3: Visualization of Literacy and Gender

6 thoughts on “Feedback Needed: Interactive map demo

  1. Dinesh Muniandy


    I am using a (2.26Ghz Intel Core 2 Duo) Macbook Pro 2009 model.
    My operating system is Mountain Lion (clean installed) with Safari 6.

    – The “OII Choropleth Visualization” page loads very quickly on Safari 6.

    – Percentage of literacy (all 3 components) of each country loads on the bar chart instantly as soon as the countries are selected.

    – Dragging the whole globe image around the browser window does appear slightly ‘static’; probably caused by the static images used

    – Zoom in and out works well and illustrates the borders of the regions very well

    – The countries are very susceptible to the mouse pointer (which is very good) and highlights itself as soon as they are touched by the mouse pointer (even on very ‘minute’ islands).

    – The blue coloured shading used to indicate the Adult literacy rate on the left pane should be changed to maybe use disparate colours, because when seen on the globe; it doesn’t differentiate for example the literacy percentages of (61 – 70%) and (71 – 80%). My taught is that you could use singular colour on the 3-bar literacy percentages of right pane and distinct colours for the literacy rates on left pane as well as on the countries shown. This would show clearly different colours for different percentages of the adult literacy rate.

    – The complete statistic for a few countries are missing (with N/A) probably caused by incomplete data on CIA

    – One major improvement that could be included on the right pane or (introduce as a bottom bar) is to incorporate a “search” bar to locate any country the user is interested in. Instead of searching for the particular country on the globe, which is faster and effective.

    – There are certainly lots of ideas that can be incorporated such as the line plot to show changes over time. This will make the map more meaningful. But in-depth research is required to study literacy rates further and it would reveal useful tools to be used on the interactive map.

    I hope I have been helpful. The map was a fun to use.


  2. Jen Lowe

    My immediate reaction is that I want to be able to compare countries to each other, and countries to the world. It would be great to let the viewer select more than one country and populate the righthand panel in a small multiple style that allowed for comparison across the three factors. –Jen

  3. Scott Post author

    Thanks, Dinesh, for these very helpful comments. That’s a great point about the search — I can see this being especially for smaller countries that are hard to click without zooming in. The color schemes are also definitely something we can work on — in terms of building a wizard for other individuals to use to map their own data, I think it will be important to allow the choice between a graduated colour scheme and disparate colours.

    Thanks again,

  4. Scott Post author

    Hi Jen,
    Thanks for the comment and apologies if you’re receiving this by email a second time. A power surge and disk corruption forced us to restore a back up of the server and lost my response to your comment.

    In short, I think this is a really good point and while it won’t work into the time frame for the first version of the visualizations, it is something I’m keen to work on in the future.

  5. Pingback: Preparing data to create your own interactive map | Interactive Visualizations

  6. Pingback: Interactive Maps | Net Increase?

Comments are closed.