Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Web Maps and Data Visualisation

Web Maps and Data Visualisation

This session will introduce some key aspects of visualising your research data using web-based maps.

Participants will have the opportunity to get hands-on and follow along with a demonstration of how to create your own simple web-based maps, using Google Maps and Carto.

Presented at NUI Galway as part of a series of informal workshops to share practice-based expertise, know-how and experience in technologies and methods germane to anyone engaged in Digital Scholarship type activity.

Dave Kelly

March 29, 2018
Tweet

More Decks by Dave Kelly

Other Decks in Education

Transcript

  1. Web Maps &
    Data Visualisation
    David Kelly
    Digital Humanities Manager,
    Moore Institute @ NUI, Galway
    29 March, 2018 | Digital Scholarship Workshop Series

    View full-size slide

  2. http://bit.ly/moore-maps-18

    View full-size slide

  3. http://luminocity3d.org/WorldPopDen/#4/37.37/53.17

    View full-size slide

  4. galwaydashboard.ie

    View full-size slide

  5. Dr Patrick Collins & Dr Aisling Murtagh – Geography @ NUI Galway

    View full-size slide

  6. https://www.nytimes.com/interactive/2016/01/07/us/drug-overdose-deaths-in-the-us.html

    View full-size slide

  7. https://www.shipmap.org/

    View full-size slide

  8. https://parallel.co.uk/3D/laei-no2

    View full-size slide

  9. • Limited free plans available *
    Code-based alternative:
    • Map design
    • Data storage
    • Embed maps
    carto.com
    mapbox.com

    View full-size slide

  10. storymap.knightlab.com
    Omeka Plugin

    View full-size slide

  11. Anatomy of a Web Map

    View full-size slide

  12. - A kind of digital map, but…
    - Not GIS applications (Geographic Information System)
    - Not Google Earth-style
    - Not print maps
    - Published online - embedded
    - Uses Tiles
    - 256 x 256 pixels
    - A ”Slippy” map
    http://a.tile.openstreetmap.se/hydda/full/15/15559/10631.png

    View full-size slide

  13. Web maps
    - Zoom levels ( => number of
    tiles increases exponentially)
    http://maptime.io/anatomy-of-a-web-map
    https://wiki.openstreetmap.org/wiki/Zoom_levels

    View full-size slide

  14. Projections
    - Google Maps uses Mercator Projection
    - Works well for 2D maps *
    http://maptime.io/anatomy-of-a-web-map

    View full-size slide

  15. https://thetruesize.com/#/aboutModal?borders=1~!MTczNTA0Njk.NTIw
    MzQ0NA*MzQ4MDk2ODM(Nzk2MDEy~!GL*MA.MTgwMDAwMDA)MA

    View full-size slide

  16. Think: Layers

    View full-size slide

  17. Layers: Base Layer (Raster Map Tiles)

    View full-size slide

  18. Data Layers
    - Feature (content) layers on top
    - Vectors – points / lines / polygons
    - Latitude / longitude [53.27392, -9.05102]
    - Data used in interaction
    - Data can be stored as GeoJSON, Shapefiles,
    TopoJSON, KML, CSV
    - We’ll use some CSV data

    View full-size slide

  19. Layers
    - Controls
    - For example: Zoom, legend, layer switcher, titles,
    search

    View full-size slide

  20. Now, make a map

    View full-size slide

  21. We want to…
    - Get (and prepare) data
    - Create a new map and upload our data to it
    - Customise map markers / interaction
    - Change the base map
    - Get an embed code to publish the map on our website

    View full-size slide

  22. Data
    https://data.gov.ie/dataset/national-inventory-of-architectural-
    heritage-niah-national-dataset

    View full-size slide

  23. • REG_NO
    • NAME *
    • NUMBER
    • STREET1
    • STREET2
    • TOWN
    • TOWNLAND
    • COUNTY
    • COUNTY_ID
    • PLANAUTH
    • COMPOSITION *
    • APPRAISAL
    • DATEFROM *
    • DATETO
    • RATING
    • ORIGINAL_TYPE
    • X_COORD
    • Y_COORD
    • X_COORD_ITM
    • Y_COORD_ITM
    • LATITUDE *
    • LONGITUDE *
    • IMAGE_LINK
    • WEBSITE_LINK
    • SURVEY_ID
    • Link

    View full-size slide

  24. Prepare our data
    A free, open source,
    powerful tool for working
    with messy data
    openrefine.org
    • Clean the data to make values consistent *
    • Extract data we’re interested in *
    • Geo-code data ( https://github.com/OpenRefine/OpenRefine/wiki/Geocoding )
    • If Google: Google Maps TOS, and limited to 2,500 addresses per day

    View full-size slide

  25. Data
    https://data.gov.ie/dataset/national-inventory-of-architectural-
    heritage-niah-national-dataset

    View full-size slide

  26. 1. Google Maps

    View full-size slide

  27. https://mymaps.google.com

    View full-size slide

  28. http://www.davidkelly.ie/talks/nuig-mapping-2018/google-map-example/

    View full-size slide

  29. 2. carto.com

    View full-size slide

  30. http://www.davidkelly.ie/talks/nuig-mapping-2018/carto-map-example/

    View full-size slide

  31. Thank you
    David Kelly
    [email protected]
    @davkell | linkedin.com/in/davkell

    View full-size slide