Welcome to Advanced GIS, Lecture 12

This is a web page that can be viewed as slides.

→ to move forward

← to go back

Advanced GIS

Class 12

<iframe width='100%' height='520'
 frameborder='0'
 src='https://eric.cartodb.com/viz/9e198634-b20e-11e4-8886-0e018d66dc29/embed_map'
 allowfullscreen
 webkitallowfullscreen
 mozallowfullscreen
 oallowfullscreen
 msallowfullscreen>
</iframe>
<iframe width='100%' height='520'
 frameborder='0'
 src='https://eric.cartodb.com/viz/9e198634-b20e-11e4-8886-0e018d66dc29/embed_map'>
</iframe>
<iframe width='100%' height='520'
 frameborder='0'
 src='your_url'>
</iframe>

so you might consider making a fullscreen map that you embed in another site

one potential problem: links in iframes

links in iframes only work when opening in a new tab

<a href="http://example.com">
    external link
</a>
<a href="http://example.com"
   target="_blank">
    external link
</a>

semi-transparent overlays

.overlay {
    opacity: 0.5;
}
.overlay {
    background: rgba(255, 255, 255, 0.5);
}
full example

centering stuff

centering stuff can be hard with CSS

.overlay {
    text-align: center;
}

only affects the text in the element

.overlay {
    margin: 0 auto;
    position: relative;
}
.overlay {
    margin: 0 auto;
    position: relative;
}

make left and right margins automatic and they balance out

jsbin
mapbox examples
mapbox examples
Edgemere Urban Renewal Park
596 Acres

call Parks and say "where's our park?"

Edgemere Urban Renewal Park

What is urban renewal?

Urban

Renewal

today

Nathan Kensinger

today

NYC EDC

today

Performing Arts Educators

today

Panoramio

so let's map them!

we weren't the first to have this idea

Community Development Program Progress Report (1968)

Atlas of Urban Renewal (1984)

what will it take?

what will it take?

  1. get the data
  2. clean the data
  3. merge the data with other useful datasets

FOIL

FOILed!

thanks to amazing volunteers

urban reviewer

tiles created via OpenStreetMap and Mapbox

~10,000 polygons

6 MB

not particularly fast

list plans

outline plans

search for plans

highlight parcels

CartoDB

  1. Leaflet
  2. Mapbox tiles
  3. CartoDB layer on top with cartodb.js

making it interactive

making it interactive

SELECT name

FROM plans

WHERE name ILIKE '%lincol%'

ST_Union, ST_ConvexHull, ST_Buffer

yeah we use the SQL API here too

dynamic styles

dynamic styles

setCartoCSS()

dynamic data

dynamic data

setSQL()