tilemill gwu-wboykinm

54
Mapping Data to the Web: A Primer for Tilemill & Mapbox

Upload: bill-morris

Post on 08-May-2015

123 views

Category:

Technology


1 download

DESCRIPTION

A quick tutorial for using the Tilemill cartography platform

TRANSCRIPT

Page 1: Tilemill gwu-wboykinm

Mapping Data to the Web: A Primer for Tilemill & Mapbox

Page 2: Tilemill gwu-wboykinm

TileMill sits at the intersection of GIS and Cartography

Page 3: Tilemill gwu-wboykinm

of the web (in code and design)

Page 4: Tilemill gwu-wboykinm

i.e. this:

Page 5: Tilemill gwu-wboykinm

not this:

Page 6: Tilemill gwu-wboykinm

built to bake up a whole batch of

speedy tiles

Page 7: Tilemill gwu-wboykinm

high performance & high interactivity

Page 8: Tilemill gwu-wboykinm

mapnik: High-quality, web-standard map

rendering

Page 9: Tilemill gwu-wboykinm

available on windows, mac, linux

Page 10: Tilemill gwu-wboykinm

free and open (free as in speech AND free

as in beer)

Page 11: Tilemill gwu-wboykinm

Download:

Page 12: Tilemill gwu-wboykinm

Fire it up:

Page 13: Tilemill gwu-wboykinm
Page 14: Tilemill gwu-wboykinm
Page 15: Tilemill gwu-wboykinm
Page 16: Tilemill gwu-wboykinm

#b8dee6 =

Page 17: Tilemill gwu-wboykinm

#4a7370 =

Page 18: Tilemill gwu-wboykinm

Map { background-color: #4a7370; }#countries { ::outline { line-color: #85c5d3; line-width: 2; line-join: round; } polygon-fill: #fff;} This stuff is called “CartoCSS”, and it looks like web CSS

Page 19: Tilemill gwu-wboykinm

Grab some open data and get started

D.C. Census Tracts:

http://db.tt/wNnjCNzK

Page 20: Tilemill gwu-wboykinm
Page 21: Tilemill gwu-wboykinm
Page 22: Tilemill gwu-wboykinm
Page 23: Tilemill gwu-wboykinm

Supported input formats:

- ESRI Shapefile – GeoTiff - PostGIS- SQLite - CSV- KML - GeoJSON

Page 24: Tilemill gwu-wboykinm
Page 25: Tilemill gwu-wboykinm
Page 26: Tilemill gwu-wboykinm
Page 27: Tilemill gwu-wboykinm
Page 28: Tilemill gwu-wboykinm
Page 29: Tilemill gwu-wboykinm
Page 30: Tilemill gwu-wboykinm
Page 31: Tilemill gwu-wboykinm
Page 32: Tilemill gwu-wboykinm
Page 33: Tilemill gwu-wboykinm
Page 34: Tilemill gwu-wboykinm
Page 35: Tilemill gwu-wboykinm
Page 36: Tilemill gwu-wboykinm
Page 37: Tilemill gwu-wboykinm
Page 38: Tilemill gwu-wboykinm
Page 39: Tilemill gwu-wboykinm

Supported output formats:

- Static Images: -  PNG / JPEG -  SVG / PDF

- Dynamic Tiles -  MBTiles (SQLite)

Page 40: Tilemill gwu-wboykinm
Page 41: Tilemill gwu-wboykinm
Page 42: Tilemill gwu-wboykinm
Page 43: Tilemill gwu-wboykinm
Page 44: Tilemill gwu-wboykinm
Page 45: Tilemill gwu-wboykinm
Page 46: Tilemill gwu-wboykinm
Page 47: Tilemill gwu-wboykinm
Page 48: Tilemill gwu-wboykinm
Page 49: Tilemill gwu-wboykinm
Page 50: Tilemill gwu-wboykinm
Page 51: Tilemill gwu-wboykinm
Page 52: Tilemill gwu-wboykinm
Page 53: Tilemill gwu-wboykinm

customize!

Page 54: Tilemill gwu-wboykinm

Support Channels:

Twitter: @mapbox

Freenode IRC: #mapbox

support.mapbox.com