-
Notifications
You must be signed in to change notification settings - Fork 12
/
index.html
133 lines (127 loc) · 13.3 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
<!DOCTYPE html><html><head><title>Big</title><meta charset='utf-8'><meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
<link href='big.css' rel='stylesheet' type='text/css' />
<style>
.new-shiny { background: #aaaaaa; }
</style>
<script src='big.js'></script></head><body>
<div><strong>Introduction to Geographic Data Formats!</strong></div>
<div><em>PLEASE</em> interrupt if you have questions!</div>
<div>Go to <a href="http://lyzidiamond.com/geodata">http://lyzidiamond.com /geodata</a> to follow along.</div>
<div>(Use <em>left</em> and <em>right</em> arrows to navigate. Links have a <a href="#4">blue background</a>.)</div>
<div><strong>First things first</strong>: What is <em>geographic data</em>?</div>
<div>Geographic data represents <strong>things that have a location</strong>.</div>
<div>This can include <strong>physical</strong> things like <em>roads</em>, <em>rivers</em>, and <em>cities</em>.</div>
<div class="center"><img src="./images/lyzimap-4.png" />OMG flood zones</div>
<div>It can also include <strong>ephemeral</strong> phenomena, like <em>rainfall rates</em>, <em>911 calls</em>, and <em>weather patterns</em>.</div>
<div class="center"><img src="./images/us_precip.gif" />OMG annual precipitation</div>
<div>Geographic data can also capture <strong>nuances</strong> of locations, like the <em>degree of slope</em> at a specific location on the side of a mountain.</div>
<div>How do we <strong>use</strong> geographic data?</div>
<div>Typically, geographic data is used for two things: <em>visualization</em> and <em>analysis</em>.</div>
<div class="center imageText"><img src="./images/analysis.png" />Analysis!</div>
<div class="center imageText"><img src="./images/stamen-terrain.png" />Visualization!</div>
<div>It is often used for <strong>both</strong>!</div>
<div class="center imageText"><img src="./images/wind.png" />So pretty.</div>
<div>There are <em>many</em> different types of <strong>geographic data</strong>, used by <em>many</em> different types of <strong>software</strong>, <strong>web tools</strong>, and <strong>libraries</strong>, for <em>many</em> different <strong>use cases</strong>.</div>
<div>Fortunately, we have many resources at our disposal to <em>transform</em> data from one type to another.</div>
<div>Let's first talk about the <strong>types</strong> of geographic data and their <strong>use cases</strong>.</div>
<div>Geographic data typically falls into two camps: <em>raster</em> data and <em>vector</em> data.</div>
<div class="center imageText"><img src="./images/dem.jpg" />Rasters!</div>
<div class="center imageText"><img src="./images/massachusetts.png" />Vectors!</div>
<div>I am most often working with <strong>vector</strong> data, so let's start there.</div>
<div>Vector geo data has <em>three</em> things: <strong>geometry</strong>, a <strong>location</strong>, and <strong>attribute information</strong>.</div>
<div>One <em>super common</em> geographic data format is the <a href="http://en.wikipedia.org/wiki/Shapefile">shapefile</a>.</div>
<div><strong>Shapefile</strong> is actually a misnomer: the data format requires <em>three different files</em> to store its core data (plus some <strong>optional</strong> files).</div>
<div>Let's take a look at a shapefile. Head over to <a href="http://bit.ly/orgeo">http://bit.ly/orgeo</a> and download the Cities shapefile.</div>
<div class="imageText"><img src="./images/orgeo.png" />http://bit.ly /orgeo</div>
<div>Clicking the link should have downloaded <em>cities.zip</em>. <strong>Extract</strong> that to a folder and <em>take a look</em> at the files in it.</div>
<div>There are two files that are <strong>unrelated</strong> to the shapefile: the PDF file and the HTML file. We can <em>ignore</em> those for now.</div>
<div>There are <strong>four</strong> other files in the folder: a <em>dbf</em>, a <em>prj</em>, a <em>shp</em>, and a <em>shx</em>.</div>
<div>The <strong>three mandatory</strong> files are the <em>dbf</em>, the <em>shp</em>, and the <em>shx</em>.</div>
<div>Open up the <strong>dbf</strong> file in a spreadsheet program.</div>
<div class="imageText" style="color:rgb(31, 189, 31)"><img src="./images/dbf.png" />It should look something like this.</div>
<div>The <em>dbf</em> contains the <strong>attribute</strong> information for the dataset, with different values for each feature.</div>
<div>Now open up the <strong>prj</strong> file in a text editor.</div>
<div class="imageText" style="color:rgb(31, 189, 31)"><img src="./images/prj.png" />It should look something like this.</div>
<div>The <em>prj</em> contains the <strong>projection</strong> information for the dataset.</div>
<div>(<em>Projections</em> deserve their own discussion. :-P)</div>
<div>We can skip the <em>shx</em> file. It is an <strong>index</strong> file to allow quick seeking within the file.</div>
<div>Ah, now to the <strong>shp</strong> file!</div>
<div>If you have <em>QGIS</em> or <em>ArcGIS</em> installed on your machine, open up the <strong>cities.shp</strong> file.</div>
<div><strong>(If you don't, just look up here!)</strong></div>
<div class="imageText"><img src="./images/cities-qgis.png" />This is what the data looks like.</div>
<div>The <strong>shp</strong> file contains the dataset's <em>geometry</em> information. (Points, lines, polygons, etc).</div>
<div>Open the <em>attribute table</em> for cities.</div>
<div class="imageText"><img src="./images/cities-table.png" />The <strong>dbf</strong> file generates this table of information.</div>
<div>Check out the <em>properties</em> of the <strong>cities</strong> file, and take a look at the <em>projection</em> (or <em>coordinate reference system</em>).</div>
<div class="imageText"><img src="./images/cities-crs.png" />The <strong>prj</strong> file generates the coordinate reference system / projection.</div>
<div><em>Shapefiles</em> can be used with most <strong>desktop GIS</strong> and <strong>spatial analysis</strong> tools.</div>
<div><em>Shapefiles</em> are <strong>not</strong> used in web maps.</div>
<div>Another <em>extremely</em> popular geographic data format is <a href="http://geojson.org">GeoJSON</a>.</div>
<div class="imageText"><img src="./images/geojson.png" />GeoJSON is very popular for use in <strong>web maps</strong>.</div>
<div>Let's look at some <em>GeoJSON</em>!</div>
<div>Head to <a href="http://bit.ly/maptimegj">http://bit.ly/maptimegj</a></div>
<div class="imageText"><img src="./images/maptime-gj.png" />This is a <strong>map</strong> displaying the data in the <em>maptimes.geojson</em> file. Click on the <strong>Raw</strong> button.</div>
<div class="imageText"><img src="./images/maptimegj-raw.png" />This is what <strong>GeoJSON</strong> looks like!</div>
<div><em>GeoJSON</em> is an extension of a format called <a href="http://json.org">JSON</a>, which stands for <strong>JavaScript Object Notation</strong>.</div>
<div>Because <em>GeoJSON</em> is basically just <strong>JavaScript</strong>, it can easily be used in <em>web maps</em>!</div>
<div class="imageText"><img src="./images/leaflet-gj.png" />For example, Leaflet loves GeoJSON.</div>
<div>GeoJSON has some <strong>required attributes</strong>. GeoJSON features need a <em>type</em>, <em>geometry</em>, and <em>properties</em>.</div>
<div>OMG <a href="http://geojson.io">GeoJSON.io</a>!</div>
<div>To learn more about GeoJSON's specificities, check out <a href="http://github.com/lyzidiamond/learn-geojson">Learn GeoJSON</a>. <strong>#shamelessplug</strong></div>
<div>In a future <a href="http://github.com/maptime">Maptime exercise</a> we will work on putting GeoJSON files on web maps. <strong>:)</strong></div>
<div>Another format: <a href="https://developers.google.com/kml/documentation/kml_tut">KML</a>.</div>
<div><strong>KML</strong> stands for <em>Keyhole Markup Language</em>. It is a file format from <strong>Google</strong> for use in <em>Google Earth</em> and <em>Google Maps</em>.</div>
<div>KML stores data in a <strong>tag-based</strong> format. This is similar to <em>GeoJSON</em>, except GeoJSON uses <strong>key-value pairs</strong> instead.</div>
<div class="imageText" style="color:rgb(31, 189, 31)"><img src="./images/kml.png">This is what KML looks like.</div>
<div>Head over to <a href="http://bit.ly/basickml">http://bit.ly/basickml</a> and play around with different types of <em>KML</em> files.</div>
<div>There are many many other types of geographic vector data, but one last one I'd like to mention here is none other than <strong>OpenStreetMap</strong>.</div>
<div class="imageText"><img src="./images/osm.png" />Maptime LOVES OpenStreetMap!</div>
<div>Head to <a href="http://osm.org">http://osm.org</a> and click <em>Export</em> at the top.</div>
<div class="imageText"><img src="./images/osm-export.png" />Zoom in, select a <strong>very small</strong> area, and click <em>Export</em>.</div>
<div>A file called <strong>map.osm</strong> should download. <em>Open</em> it in a text editor.</div>
<div class="imageText" style="color:rgb(31, 189, 31)"><img src="./images/osm-data.png" />It should look ike this.</div>
<div>OSM data is sort of like KML, but has <strong>different information</strong>.</div>
<div>It contains a <em>node id</em>, <em>changeset number</em>, <em>user</em>, and of course <em>latitude</em> and <em>longitude</em>, among other info.</div>
<div>Let's quickly talk about <strong>raster data</strong>.</div>
<div>Like <em>vector</em> data, <em>raster</em> data contains <strong>location</strong>. But it stores its <em>attribute information</em> differently.</div>
<div>Raster data stores its information in its <em>pixels</em>. This information can include <em>height</em>, <em>slope</em>, <em>direction</em>, <em>color</em>, and many others.</div>
<div>As far as <strong>formats</strong>, a very popular one is the <em>GeoTIFF</em>.</div>
<div><img src="./images/geotiff.jpg" />OMG GeoTIFF</div>
<div>A <strong>GeoTIFF</strong> is simply a <em>TIFF</em> (tagged image file format) file that <strong>maintains location information</strong>.</div>
<div>The most typical uses for <em>rasters</em> in a <strong>geographic</strong> context are <em>digital elevation models</em> and <em>aerial photography</em>. These can be used to make other things, too.</div>
<div class="imageText"><img src="./images/hillshade.jpg" />One example: digital elevation models can be interpolated to make hillshades.</div>
<div>Just as many <strong>spatial problems</strong> can be solved with <em>raster</em> data as <em>vector</em> data. <strong>What are some of them?</strong></div>
<div><strong>Homework:</strong>Check out <a href="http://opentopography.org">OpenTopography at http://opentopography.org</a> and take a look at some <em>elevation</em> data.</div>
<div>In addition to <strong>rasters</strong> and <strong>vectors</strong>, there's one other <em>very popular</em> geo data type.</div>
<div><img src="./images/csv.png" /><strong>Tables!</strong></div>
<div>Geographic data is <em>very commonly</em> stored in tables of various types.</div>
<div>These include <strong>CSV</strong>, <strong>Excel</strong>, <strong>Google Spreadsheets</strong>, and many others.</div>
<div><em>What are some places you might find tabular geographic data?</em></div>
<div><strong>Tabular data</strong> can be <em>geocoded</em> to be displayed on a map.</div>
<div>(Geocoding also deserves its own conversation.)</div>
<div>There are <a href="http://en.wikipedia.org/wiki/GIS_file_formats">many more</a> formats than the ones we just talked about.</div>
<div>There's the <strong>file geodatabase</strong>, <a href="https://github.com/mbostock/topojson">TopoJSON</a>, <a href="http://postgis.net">PostGIS</a>, <a href="https://www.gaia-gis.it/fossil/libspatialite/index">SpatiaLite</a>, <a href="http://en.wikipedia.org/wiki/Well-known_text">Well-known Text</a>, <a href="http://en.wikipedia.org/wiki/Web_Feature_Service">Web Feature Service</a>, and even more.</div>
<div>(If you're going to poke around, check out <strong>PostGIS</strong> first. <em>Super</em> powerful.)</div>
<div>Much of the work in geo these days requires some <em>data transformation</em>.</div>
<div>There are <strong>many tools</strong> that allow for transformation, including <a href="http://qgis.org">QGIS</a>, <a href="http://gdal.org">GDAL</a>, and <a href="http://gdal.org/ogr2ogr">OGR2OGR</a>, among others.</div>
<div><em>What did we learn today?</em></div>
<div>Geographic data exists in a <strong>variety</strong> of formats.</div>
<div><em>Shapefiles</em> are commonly used for <strong>spatial analysis</strong> and <strong>visualization</strong> on your <em>desktop</em>.</div>
<div><em>GeoJSON</em> and <em>KML</em> are commonly used for <strong>web maps</strong>.</div>
<div>You can <em>download</em> vector data from <strong>OpenStreetMap</strong>!</div>
<div>There are <em>lots</em> of places on the internet to find <strong>geographic data</strong>.</div>
<div>Heck yes!</div>
<div>Just knowing about <strong>these few</strong> data types can make you a <em>very strong</em> geographic data user.</div>
<div><strong>YOU'RE A CHAMPION!</strong> Keep learning more!</div>
<div>Thanks.</div>
<div>Lyzi Diamond, @lyzidiamond, lyzidiamond.com</div>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-47757349-1', 'lyzidiamond.com');
ga('send', 'pageview');
</script>
</body>
</html>