Advanced Interactive Web Mapping, Programming, and Design

Class 1: Refreshers and CartoDB

Class 2: CartoCSS and SQL

Class 3: APIs

Class 4: APIs continued

Class 5: APIs continued

Class 6: Leaflet

Class 7: Leaflet

Class 8: Spatial SQL, CartoDB.js

Class 9: More CartoDB.js

Class 10: Mapbox

Class 11: Templates, Turf

Class 12

Wrap-up

JavaScript

• select element that changes a div's color (commented)
• SQL API: set text of an HTML element
• SQL API: listing data from rows in a table
• Dynamic streetview image

Leaflet

• CartoDB SQL API: mapping some rows in a table
• CartoDB SQL API: mapping some rows in a table, zooming to the mapped rows
• Style features as circles
• Features with events
• Using the Leaflet.MapPaint plugin
• Styling popups
• Dynamic popups
• Looping over features
• Leaflet with functions
• Searching with Mapzen Search
• Map events
• Layer and marker events
• Leaflet.timeline
• Leaflet with Mustache popups

CartoDB

• CartoDB.js: Create a simple visualization
• CartoDB.js: Hide a layer
• CartoDB.js: Set the SQL of a layer
• CartoDB.js: Set the SQL of a layer on an event
• CartoDB.js: Adding Leaflet plugins

Mapbox

• Leaflet with Mapbox tiles
• Simple Mapbox GL JS example
• Mapbox GL JS loading GeoJSON

Turf

• Buffering polygons
• Convex hull
• Counting points in polygons, making a choropleth
• Using Turf functions on dynamic points

Mustache

• Simple template
• Template in HTML
• Using templates to display dynamic data