TileMill
Quickly and Easily Design Maps for the Web
Shaky Sherpa
Matt Berg
Modi Research Group
The Earth Institute. Columbia University
Plan for tonight..
 Importing a spreadsheet(from formhub)
We we will walk through how to import a basic
spreadsheet(csv) and ESRI Shapefile into TileMill.
 Styling data
Here we show the basics of using Carto - a CSS-like
language - to style your data in TileMill.
 Adding tooltips and legends
Here we show how to add tooltip interactivity and legends to
maps.
 Exporting your map
Here we show how to export a map from TileMIll as a fully
interactive map that can be shared on the web.
Geographic Information
GEOGRAPHIC INFORMATION
LOCATION
ATTRIBUTE
Where?
Where?
What?
What?
Latitude (y)
Latitude
(y)
Longitude (x)
Longitude
(x)
Information
to
Informationlinked
linked
tolocation
location
Altitude (z)
Altitude
(z)
i.e. name,
name, population,
i.e.
population,
description
description
Location represents where on the earth the items of interest are located
Attribute provides information about what is occurring there
Basics
 GIS- Geographic Information System
 (Recording, Analysis or Display of Data that is related
to a location)
 Map Projections
 (Refers to method used for representing a 3D object
like Earth on a 2D surface like paper or computer)
 Coordinate systems
 (Provide ways of describing a specific location on the
earth. Using latitude and longitude or using distance in
meters from the Equator)
Features: Points, Lines, and Polygons
Points
 households, populated place centroid, facility (school, health),
water sources
 x,y coordinates
Line
 roads, electricity grid, water pipelines, rivers
 series of x, y coordinates connected to form path/network
Polygon
 boundary, administrative area, service area
 series of x, y coordinates connected to form enclosed area
* Display Hierarchy: (1) Points, (2) Lines, and (3) Polygons
What is a shapefile?
A vector data storage format for storing the location, shape, and attributes of
geographic features. A shapefile is stored in a set of related files and contains
one feature class.
Shapefile Limitations:
• Cannot store null values
• Round up numbers
• Poor support for Unicode character strings
• Field names can not be longer than 10 characters
• Cannot store both a date and time in a field
• 2 GB size limit for any shapefile component file (max ~ 70 million point features)
• May take up three to five times as much space as a geodatabase
• Spatial queries take longer compared to a geodatabase feature class
Source: ESRI ArcGIS Desktop Help and GIS Glossary
Interface tour
1. List of Projects
2. New Project
Editing Interface
1. Main toolbar 2. Map Preview 3. Editing Tools 4. StyleSheet Editor
M
1. Map Preview
2. Zoom Controls and Full Page toggle
1. Add Layer button 2. Geometry Icon 3.Layer Name
4. Inspect Layer Data 5. Edit Layer 6. Delete Layer
1. Active stylesheet 2. Inactive stylesheet 3. New stylesheet
4. Line numbers 5. Text Area 6. Color Palette
Adding Layers
 TileMill supports creating map layers from following
types of files and databases
 CSV
 ESRI Shapefile
 KML(Google Earth)
 GeoTIFF(Raster Data)
 GeoJson
 SQLite(spatial database)
 PostGIS(spatial database)
Layer Settings
 ID – This is the name of the layer
(can include letters, numbers, dashes or underscores)
 DataSource (local files or url)
 SRS(Spatial Reference System)
-TileMill autodetects it but sometimes it needs be specified
Project Settings
 Tooltips
(allows you to make your maps interactive with dynamic
tooltips that appear when you hover or click on a feature (any
point or polygon).
Teaser – displays on hover
Full – displays on click
 Legend
(allows you to make your maps interactive with dynamic
tooltips that appear when you hover or click on a feature (any
point or polygon).
Carto
 Similar to CSS (Cascading Style Sheet for Web)
 Various types of Symbolizers:










Line (for lines & polygons)
Polygon (for polygons)
Point (for points)
Text (for points, lines, and polygons)
Shield (for points & lines)
Line Pattern (for lines & polygons)
Polygon Pattern (for polygons)
Raster (for rasters)
Markers (for points, lines, & polygons)
Buildings
Exporting
 MBTILES
 PNG
 PDF
 SVG
GIS Data Sources
Natural Earth
Global Administrative Areas (GADM)
CloudMade (OSM data)
NYC Open Data (city agencies)
geocommons