Slide 1

Slide 1 text

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

Slide 2

Slide 2 text

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

Slide 3

Slide 3 text

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

Slide 4

Slide 4 text

galwaydashboard.ie

Slide 5

Slide 5 text

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

Slide 6

Slide 6 text

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

Slide 7

Slide 7 text

https://www.shipmap.org/

Slide 8

Slide 8 text

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

Slide 9

Slide 9 text

Tools

Slide 10

Slide 10 text

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

Slide 11

Slide 11 text

storymap.knightlab.com Omeka Plugin

Slide 12

Slide 12 text

No content

Slide 13

Slide 13 text

Anatomy of a Web Map

Slide 14

Slide 14 text

- 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

Slide 15

Slide 15 text

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

Slide 16

Slide 16 text

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

Slide 17

Slide 17 text

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

Slide 18

Slide 18 text

Think: Layers

Slide 19

Slide 19 text

Layers: Base Layer (Raster Map Tiles)

Slide 20

Slide 20 text

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

Slide 21

Slide 21 text

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

Slide 22

Slide 22 text

Now, make a map

Slide 23

Slide 23 text

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

Slide 24

Slide 24 text

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

Slide 25

Slide 25 text

• 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

Slide 26

Slide 26 text

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

Slide 27

Slide 27 text

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

Slide 28

Slide 28 text

No content

Slide 29

Slide 29 text

No content

Slide 30

Slide 30 text

1. Google Maps

Slide 31

Slide 31 text

No content

Slide 32

Slide 32 text

https://mymaps.google.com

Slide 33

Slide 33 text

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

Slide 34

Slide 34 text

2. carto.com

Slide 35

Slide 35 text

No content

Slide 36

Slide 36 text

No content

Slide 37

Slide 37 text

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

Slide 38

Slide 38 text

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