Dabbling with Data Visualisation


Published on

There are a number of examples throughout history where visualisations have been used to explore or explain problems. Notable examples include Florence Nightingale's 'Mortality of the British Army' and John Snow's Cholera Map of London. Recently the increased availability of data and software for analyzing and generating various views on this data has made it easier to generate data visualisations. In this presentation Martin Hawksey, advisor at the Jisc Centre for Educational, Technology and Interoperability Standards (Cetis), will demonstrate simple techniques for generating data visualisations: using tools (including MS Excel and Google Spreadsheets), drawing packages (including Illustrator and Inkscape) and software libraries (including d3.js and timeline.js). As part of this participants will be introduced to basic visual theories and the concepts of exploratory and explanatory analytics. The presentation will also highlight some of the skills required for discovering and reshaping data sources.

The presentation was live-blogged by Nicola Osborne (EDINA) http://nicolaosborne.blogs.edina.ac.uk/2013/06/19/data-visualisation-talk-by-martin-hawksey/

The slides contain links to source (when you get to the data/vis matrix some of the thumbnails are live links), here’s also the bundle of top level links http://bitly.com/bundles/mhawksey/l

[Note: Only images/text after slide 13 Making Data Visualisation (unless attributed to other authors is CC-BY Martin Hawksey]

Published in: Education, Technology
1 Like
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide
  • 1854 John Snow cholera mapWhat do you see, how do you read it?each death as a barclustered around the pump in Broad (now Broadwick) street
  • John Snow 2013 styleData georeferenced by Robin Wilson University of Southampton Rendered in CartoDB by Simon Rogers (formerly Guardian now at Twitter)(Other geo display tools include GeoCommons)
  • QuestionsWhere is the pumpWhat do the symbols mean
  • Also how you position marks on a canvas in relation to each otherbased on his experience and intuition rather than hard core research
  • Two versions of John Snows map highlight difference between explantantory and exploratory visualisations
  • Interpretation Edward Tufte is interesting on this. He points out thatThe big problem is that dot maps fail to take into account the number of people living in an area and at risk to get a disease … Snow's dot map does not assess varying densities of population in the area around the pump
  • Point size – often a lie
  • 3 broad categories for making visualisations: use, draw and codeUseExisting tools or services from basic Excel to more advance tools like CartoDB, Gephi, Tableau/DatameerDrawBy hand like John Snow or using software like Inkscape, Illustrator (sometimes using tools can get you only so far and a final assembly/tweak is required by handCodeThere are a number of code libraries you can use like processing.js, d3.js, Google Visualisation API to render data. You can also use tools like R to draw graphs from the command line
  • Show me the data…
  • DiscoveryAvailability (scraping)Promoting your data sources
  • Data literacies – knowing how to hunt for data
  • Getting the data is often only the first step. Knowing/discovering how to get data into a shape so that it’s easy to visualise
  • Let look at some of this in practice
  • CitzenRelay was a project that was part of the Cultural Olympiad. Citizen reporting of the torch relay around Scotland. Watching the project from the sidelines I started playing with some of the data …
  • TimelineJS is an open-source tool that enables you to build visually-rich interactive timelines. Data can be rendered from a json file or even easier a Google Spreadsheet template. In the original version Topsy gave api keyless access to the data. This recently changed so the version you see is using an api key
  • The tricks in this are knowing that:entering a public kmlurl in Google Maps search box will render the markupTaking a punt on undocumented api functionality (unclear from the tags feed that you can format as kmlhttps://code.google.com/p/audioboo-api/wiki/ReferenceIndex#Tagged_audio_clips
  • Using the Google Spreadsheet Mapper template http://www.google.co.uk/earth/outreach/tutorials/spreadsheet3.html gives is a way to create formatted placemarkers
  • NodeXL(Network Overview, Discovery and Exploration for Excel) is an open source add-on for MS Excel (Windows). I like it because you are working within a spreadsheet environment making some of the data reshaping easier. NodeXL also has a number of data import helpers for Twitter, Facebook and mediawiki. Usually it’s used to generate network graphs which allow you to explore relationships between nodes. In this example I’m ignoring this feature and instead using the tool as an easy way to grab the avatars of anyone using the #citizenrelayhashtag and laying out on a grid
  • Using the data captured using NodeXL it was easy to export this in a file format for another network graph tool, Gephi.
  • http://mashe.hawksey.info/2012/12/guest-post-for-big-data-week-bdw13-getting-creative-with-big-data-and-google-apps/All the previous examples have looked at single data sources I thought it would be nice to show an example of combining data
  • Dabbling with Data Visualisation

    1. 1. Data VisualisationMartin Hawksey (@mhawksey)http://bit.ly/DataVisEd
    2. 2. http://bit.ly/DataVisEdhttp://www.guardian.co.uk/news/datablog/2013/mar/15/john-snow-cholera-map
    4. 4. Bertin’s Visual Variables
    5. 5. Gestalt psychology(Gestalt Laws)
    6. 6. Explanatory visualizationData visualizations that are used totransmit information or a point ofview from the designer to thereader. Explanatory visualizationstypically have a specific “story” orinformation that they are intendedto transmit.Exploratory visualizationData visualizations that are used bythe designer for self-informativepurposes to discover patterns,trends, or sub-problems in adataset. Exploratory visualizationstypically don’t have an already-known story.
    7. 7. http://bit.ly/DataVisEd
    9. 9. Use DrawD3CodeHT Bret Victor
    11. 11. Dr. Tony HirstThe Open University@psychemediaouseful.infoLuke, find the feed…
    12. 12. http://bit.ly/DataVisEd
    13. 13. Use Draw CodeAccessShapeDisplayTwitter (Topsy) Media TimelineCaution: APIs change and break things
    14. 14. Use Draw CodeAccessShapeDisplayAudioboo Google MapTip: API documentation is often incomplete.Sometimes it’s worth a punt
    15. 15. Use Draw CodeAccessShapeDisplayAudioboo Google EarthCaution: Google Spreadsheets are a greatway to reshape data and republish butworth making a ‘flat’ copy in case the chainbreaks
    16. 16. Use Draw CodeAccessShapeDisplayNodeXL (SNA)Tip: NodeXL is a great tool to startlearning about social network analysisbecause it comes with a number of dataimporters. Also check nodexlgraphgalleryfor ideas and recipes
    17. 17. Use Draw CodeAccessShapeDisplayGephiCaution: Gephi is a great exploratory tool,but be careful when publishing flat imagesto explain the story the data tells you
    18. 18. Use Draw CodeAccessShapeDisplayHeart of #UKOER
    19. 19. Use Draw CodeAccessShapeDisplayTwitter Referral/Google AnalyticsCaution: This example is about to break dueto Twitter API changes 
    20. 20. Martin Hawkseymashe.hawksey.info@mhawksey