View
104
Download
0
Category
Tags:
Preview:
DESCRIPTION
This is the presentation given at the Denver http://www.meetup.com/geo-co meetup. We explain a bit of how we used open data to create an interactive map. http://silverbiology.com/projects/cartodb/casestudies/denvercrime/
Citation preview
GEO Colorado
Denver Crime Data using CartoDB and HighCharts
Key Points
• Introduce CartoDB
• Explain about CartoCSS
• SQL via CartoDB API's
• Telling your story
CartoDB
• Geospatial mapping
• Data stored in the cloud
• PostGIS engine
• Supports CartoCSS
• SQL API
• Leaflet and Google Maps Libraries
• Graphical Editor for Point & Polygons
• Lots of Examples
• Free 5MB account
• FAST!!!
www.cartodb.com
Denver Crime Online Portal
Goal: To create an interactive map to view the
Denver crime data and to do it in less than a day.
Requirements:
• Use open data
• Use open source software
• Real Time Interaction
• Enjoyable to users
• Make it informative and Fast!!!
Existing Portal
http://denvergov.org/maps/classic/crmds
Existing Portal
http://denvergov.org/maps/classic/crmds
Existing Portal
http://denvergov.org/maps/classic/crmds
Data & Software
Denver Open Data Catalog
Shapefiles Used
• http://data.denvergov.org/dataset/city-and-county-of-denver-crime
• http://data.denvergov.org/dataset/city-and-county-of-denver-police-districts
Software Used
• HTML, JavaScript, CSS
• jQuery
• CartoDB, Leaflet, CloudMade Tiles
• HighCharts
Old vs New
DEMO
http://goo.gl/GiWgd
http://www.silverbiology.com/projects/cartodb/casestudies/denvercrime/
Resources
CartoCSS:
• http://mapbox.com/tilemill/docs/manual/carto/
• http://mapbox.com/carto/latest.html
HighCharts: http://www.highcharts.com
CartoDB: http://www.cartodb.com
CartoCSS
@c:offense_ca;
#crime{
marker-fill:#AA2143;
marker-width:1;
marker-line-color:#999;
marker-line-width:0;
marker-opacity:1;
marker-line-opacity:1;
marker-placement:point;
marker-type:ellipse;
marker-allow-overlap:true;
[@c="larceny"]{
marker-fill:#FDFC74
}
[@c="white-collar-crime"]{
marker-fill:#EDEDED
}
[@c="drug-alcohol"]{
marker-fill:#1974D2
}
[@c="aggravated-assault"]{
marker-fill:#C364C5
}
[@c="robbery"]{
marker-fill:#BAB86C
}
[@c="burglary"]{
marker-fill:#1CAC78
}
[@c="murder"]{
marker-fill:#CD4A4A
}
[@c="theft-from-motor-vehicle"]{
marker-fill:#ADADD6
}
[@c="arson"]{
marker-fill:#FF7538
}
[@c="other-crimes-against-persons"]{
marker-fill:#FF48D0
}
[@c="public-disorder"]{
marker-fill:#DBD7D2
}
[@c="all-other-crimes"]{
marker-fill:#95918C
}
[@c="auto-theft"]{
marker-fill:#232323
}
}
#crime[zoom>12]{
marker-width:2;
}
#crime[zoom>14]{
marker-line-width:1;
marker-width:3;
}
#crime[zoom>16]{
marker-line-width:1;
marker-width:5;
}
SQL for Pie Chart
SELECT
count(*) as sz,
count(*)::float/(SELECT count(*) FROM crime WHERE
neighborho = 'baker' )*100 as percent,
c.offense_ca
FROM denverhoods dh
JOIN crime c ON c.neighborho=dh.neighborho
WHERE c.neighborho = 'baker'
GROUP BY c.offense_ca
ORDER BY sz DESC
Recommended