Making Maps
with Open Data
Injecting spatial into your everyday data munging is an easy way to
punch up the impact of your applications:
don't just show
what, show where.
(Plus, maps just look cool.)
FUN FACT: you don't have to be a GIS "expert" to make a web map.
Wait... What even is "GIS"?
Technically, Geographic Information Systems
means
computer systems, infrastructure, software, an
entire industry dedicated to "spatial data"... blah, blah, blah,
blah
Really, GIS is mostly about "using spatial data to make maps"
*Note:
For this talk today, "(geo)spatial" data and "GIS" data are interchangable
What's so special
about spatial data?
Not very much!
Spatial data is just regular data, with location info attached.
For Example...
Regular data:
Table of firestations in Austin - via data.austintexas.gov
...Spatialized:
Table of firestations in Austin with lat/lon coordinates - via data.austintexas.gov
Which can make:
Map of firestations in Austin - via data.austintexas.gov
Types of GIS Data
Vector vs. Raster
Spatial data comes in two flavors: vector
and raster
Most likely, most of the data you'll work with (or create) will be vector data
Vector GIS data
Points, lines, and polygons.
Inherently spatial
Just like geometric points are defined by an (x,y) pair:
geospatial points can be defined by (lat/lon) coordinates.
What's it good for?
- Points of interest (e.g., firestations)
- Roads, rivers, boundary lines
- Lakes, building footprints, census areas
- etc.
Working With GIS Data
Data formats
SPOILER ALERT:
Most of the (vector) data you'll find will be "a shapefile"
This is "a shapefile."
Yes, really.
Spatial data for the web
To use spatial data in a web app, you've got options:
- Database
- Map Server
- Binary File: XML, JSON, CSV, etc
or...
GeoJSON: Regular JSON, but with coordinates. e.g.,
{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [-97.740323, 30.274656]
},
"properties":
{
"name": "Texas Capitol Building",
"address": "1100 Congress Ave, Austin, TX 78701"
}
}
Local Data Resources
We're lucky: Texas has a ton of great, open GIS data!
Some places to start looking:
Finding Data
Beyond Texas, GIS data is everywhere - but finding it can be tricky.
On larger scales, Government-sponsored data portals (like data.gov for the US) can be a great resource.
Remember: People are a great resource
I was curious about popular datasets outside of Texas...
...so I asked the internet.
Lots of wonderful people responded! See:
https://twitter.com/sarasomewhere/status/781236823305564160
Once you have data...
Useful Online Tools
- ogre.adc4gis.com: Convert from one format to another
- mapshaper.org: Make giant datasets tiny, fast
- geojson.io: Quickly validate & visualize your GeoJSON
Building web maps
for fun & profit
In a nutshell
TL;DR: a web map* is a map in the browser which lets you click, zoom, and pan
*(sometimes called a "slippy map")
lots of options here, LeafletJS is one of the most popular.
A word about basemaps
An important component of a web map is the basemap: the underlying map tiles that give your data context.
Many free-to-use basemaps have been created using OpenStreetMap's open data
Examples: some OSM-based basemaps
Let's Make a Map!
Option 1: GitHub + GeoJSON
Simple maps in 2 minutes or less: no customization options, but great for quickly displaying data on a map
- Push a GeoJSON file to GitHub.
- View your GeoJSON file on GitHub.
- There is no step three.
Option 2: Leaflet
An open source JavaScript library, Leaflet is the "glue" between your data, a basemap, and a beautiful, mobile-friendly "slippy map" interface.
Sample code
Building your own map
What now?
Choose your own adventure!
- Find data*
- Convert data to web-friendly GeoJSON (if needed)
- Use a mapping library like Leaflet to display your data on an interactive "slippy map"
- ???
*Ready-made sample data: sarasafavi.com/maps/libraries.json