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