Welcome to Methods 3, Lecture 8

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

→ to move forward

← to go back

Methods 3

Regis Carto map

Maanasa Carto map

modeling

source

models are simplified descriptions of reality

models attempt to answer questions we don't have perfect data for

where in the US do people lack access to food?

source

where in NYC are people most likely to be gentrified out of their neighborhood?

source

where in LA do people most need affordable housing?

source

where in LA do people need more parks?

source

where is affordable housing threatened?

source

seek out a model that suits your needs

it's okay to critique a model and change it

you can also make up your own models

when you make your own, try to test the model

where in Queens are renters most likely to be negatively affected by Airbnb listings?

we'll model this using:

median income
percentage of renters
number of Airbnb listings

source

we want scores that are lower for less of an effect, higher for a greater effect

we'll scale each field down to a 0 → 1 range

for example, median income goes from 15474 to 151964

tracts closer to 151964 will be closer to 0 (less effect)

for example, median income goes from 15474 to 151964

tracts closer to 15474 will be closer to 1 (more effect)

scale_linear( "med_income", 
    15474, 151964,
    1, 0)

always sort the new column in the attribute table to confirm that it worked

then we can add each of these scaled fields together and know 0 is the lowest and 3 is the highest

if you have `s_income`, `s_renters` and `s_airbnb`, you can add them together to get your model value (index)

in-class exercise, part 1

preparing data for the web

what if your data takes up too much space?

or is so large it's taking too long to upload?

you either have to reduce the number of features or make the features smaller

1. clip/filter features if you can

2. delete attributes

3. simplify polygons

2. delete attributes you don't need

3. simplify polygons: QGIS or mapshaper.org

source

1. clip/filter features if you can

2. delete attributes

3. simplify polygons

analysis

in many cases, these are shortcuts for things you'll do in QGIS

geocoding

buffer

convex hull

some are only available if you pay for credits

you can chain analyses

for example, to combine filters

how is a webmap different from a map made in QGIS?

let's talk about making features look different based on the zoom level

or "zoom-dependent styles"

this will take a little...

code

#layer {
  marker-width: 2;
  marker-fill: #EE4D5A;
  marker-fill-opacity: 0.9;
  marker-line-color: #FFFFFF;
  marker-line-width: 1;
  marker-line-opacity: 1;
  marker-placement: point;
  marker-type: ellipse;
  marker-allow-overlap: true;

  [zoom >= 3] {
    marker-width: 5;
  }
}

CartoCSS

(open source)

why?

you can do more with it

you can share it

(it's just text)

source

CartoCSS

mrstaticvoid on flickr

niklasstjerna on flickr

#layer {
  marker-fill: #ff307a;
  marker-line-color: #FFF;
  marker-line-width: 0.25;
  marker-line-opacity: 0.4;
  marker-width: 2;
  marker-allow-overlap: true;
}

this is a statement

#layer {
  marker-fill: #ff307a;
  marker-line-color: #FFF;
  marker-line-width: 0.25;
  marker-line-opacity: 0.4;
  marker-width: 2;
  marker-allow-overlap: true;
}

between { }, set your properties

think of the { } as bookends

what is a property?

they're defined in the documentation for CartoCSS

#layer {
  marker-fill: #ff307a;
}

#layer {
  marker-fill: #ff307a;
}

always one per line, each line ending with a ;

#layer {
  marker-fill: #ff307a;
  marker-line-color: #FFF;
}

#layer {
  marker-fill: #ff307a;
  marker-line-color: #FFF;
}

separate the property name and the value by a :

property values will often be color strings, numbers, or true/false

check the documentation if you have any doubts

#layer {
  marker-fill: #ff307a;
  marker-line-color: #FFF;
}
marker-width: 5;

#layer {
  marker-fill: #ff307a;
  marker-line-color: #FFF;
}
marker-width: 5;

don't do this!

#layer {
  marker-fill: #ff307a;
  marker-line-color: #FFF;
}
marker-width: 5;

this line won't do anything

Carto often splits polygon fill and outline into two statements

#layer {
  polygon-fill: #826DBA;
  polygon-opacity: 0.9;
}
#layer::outline {
  line-width: 1;
  line-color: #FFFFFF;
  line-opacity: 0.5;
}

in-class exercise, part 2

let's vary some properties by zoom level

#layer {
  marker-width: 3;
  ...
  [zoom >= 10] {
    marker-width: 8;
  }
}

let's call these conditional statements

conditional statements are only used if some condition is met

#layer {
  marker-width: 3;
  ...
  [zoom >= 10] {
    marker-width: 8;
  }
}

"make the markers 3 pixels wide. if the map is at zoom level 10 or higher, make the markers 8 pixels wide."

#layer {
  marker-width: 3;
  ...
  [zoom >= 10] {
    marker-width: 8;
  }
  [zoom >= 16] {
    marker-width: 13;
  }
}

if you put a zoom condition on the whole layer, the whole layer only appears at that zoom

#layer[zoom >= 10] {
  marker-width: 3;
  ...
}

#layer[zoom >= 10] {
  marker-width: 3;
  ...
}

the layer will only show up for zoom 10 and above

in-class exercise, part 3

that's not all!

you can change styles based on a feature's attributes

#layer {
  marker-width: 3;
  ...
  [bright_ti4 >= 350] {
    marker-width: 8
  }
}

look familiar?

let's call these attribute-dependent styles

conditional statements on strings need to wrap those strings in quotation marks

#layer {
  marker-width: 3;
  ...
  [daynight = 'D'] {
    marker-width: 8;
  }
}

in-class exercise, part 4

back to CartoCSS

combine conditions with , to set properties with either condition

#layer {
  marker-width: 3;
  ...
  [bright_ti4 > 350] {
    marker-width: 8;
  }
}

#layer {
  marker-width: 3;
  ...
  [bright_ti4 > 350],
  [daynight = 'D'] {
    marker-width: 8;
  }
}

shortcut for:

#layer {
  marker-width: 3;
  ...
  [bright_ti4 > 350] {
    marker-width: 8;
  }
  [daynight = 'D'] {
    marker-width: 8;
  }
}

#layer {
  marker-width: 3;
  ...
  [bright_ti4 > 350],
  [daynight = 'D'] {
    marker-width: 8;
  }
}

make markers where bright_ti4 is greater than 350 larger

also make markers with daynight of "D" larger

combine conditions without a , to set properties with both conditions

#layer {
  marker-width: 3;
  ...
  [bright_ti4 > 350][daynight = 'D'] {
    marker-width: 8;
  }
}

#layer {
  marker-width: 3;
  ...
  [bright_ti4 > 350][daynight = 'D'] {
    marker-width: 8;
  }
}

make markers where bright_ti4 is greater than 350 and daynight = "D" larger

recap

conditional statements look like

[bright_ti4 >= 350] {
  ...
}

restrict statements more by putting conditions next to each other

[bright_ti4 >= 350][bright_ti4 < 360] {
  ...
}

both conditions must be true

include more features by separating conditions with ,

[bright_ti4 >= 350],
[zoom >= 10] {
  ...
}

either condition could be true

you can use as many of these as you need to

#layer {
  [zoom >= 7] {
    ...
  }
  [zoom >= 11] {
    ...
  }
  [zoom >= 12] {
    ...
  }
  ...
}

you don't have to memorize all of this

cartocss reference

Methods 3

modeling

models are simplified descriptions of reality

models attempt to answer questions we don't have perfect data for

where in the US do people lack access to food?

where in NYC are people most likely to be gentrified out of their neighborhood?

where in LA do people most need affordable housing?

where in LA do people need more parks?

where is affordable housing threatened?

seek out a model that suits your needs

it's okay to critique a model and change it

you can also make up your own models

when you make your own, try to test the model

where in Queens are renters most likely to be negatively affected by Airbnb listings?

we'll model this using:

we want scores that are lower for less of an effect, higher for a greater effect

we'll scale each field down to a 0 → 1 range

for example, median income goes from 15474 to 151964

for example, median income goes from 15474 to 151964

tracts closer to 151964 will be closer to 0 (less effect)

for example, median income goes from 15474 to 151964

tracts closer to 15474 will be closer to 1 (more effect)

always sort the new column in the attribute table to confirm that it worked

then we can add each of these scaled fields together and know 0 is the lowest and 3 is the highest

if you have s_income, s_renters and s_airbnb, you can add them together to get your model value (index)

in-class exercise, part 1

preparing data for the web

what if your data takes up too much space?

or is so large it's taking too long to upload?

you either have to reduce the number of features or make the features smaller

2. delete attributes you don't need

3. simplify polygons: QGIS or mapshaper.org

analysis

in many cases, these are shortcuts for things you'll do in QGIS

geocoding

buffer

convex hull

some are only available if you pay for credits

you can chain analyses

for example, to combine filters

how is a webmap different from a map made in QGIS?

let's talk about making features look different based on the zoom level

or "zoom-dependent styles"

this will take a little...

code

CartoCSS

why?

you can do more with it

you can share it

you can share it

CartoCSS

this is a statement

this is a statement

between { }, set your properties

think of the { } as bookends

what is a property?

they're defined in the documentation for CartoCSS

separate the property name and the value by a :

property values will often be color strings, numbers, or true/false

check the documentation if you have any doubts

don't do this!

this line won't do anything

Carto often splits polygon fill and outline into two statements

in-class exercise, part 2

let's vary some properties by zoom level

let's call these conditional statements

conditional statements are only used if some condition is met

if you put a zoom condition on the whole layer, the whole layer only appears at that zoom

the layer will only show up for zoom 10 and above

in-class exercise, part 3

that's not all!

you can change styles based on a feature's attributes

look familiar?

let's call these attribute-dependent styles

conditional statements on strings need to wrap those strings in quotation marks

in-class exercise, part 4

back to CartoCSS

combine conditions with , to set properties with either condition

combine conditions without a , to set properties with both conditions

recap

if you have `s_income`, `s_renters` and `s_airbnb`, you can add them together to get your model value (index)