Day 107 of 180 Days of Data Viz Learning #jfdi

I’m doing some form of data visualization learning for 180 days because I need to #JFDI.

See post explaining how and why I’m doing this.

Code Learning:

Knight Journalism Intermediate D3 for Data Visualization 

Week Four Lecture: Encoding Data on the Map
Three Takeaways:
·         Choropleth map – coloring map for meaning – D3.scale.quantize() function allows you to put in numeric values and gets back colors (essentially a scale)
·         Colorbrewer color palettes are validated spectrums/palettes for skews and colorblindness
·         You bind new data to each country to show data
  • Create Parameter and use a calculated field
  • Drag that into Filters
    – Use Sets to create a custom grouping to filter on if none exists (eg. a non-default sales region)
  • Combine sets and dimensions for stronger filtering capabilities

Iterate Data

  • Immutability: “forEach provides for a basic way to loop through our data set. We can use this to modify the data in place, generate counts, or perform other manipulations that deal with each piece of data individually. This works, but can get clunky and confusing fast. Keeping straight what form the data is in at any given time can be confusing, as can side effects of modifying your data that you might not be aware of. To combat this confusion, it can be useful to think of the data as immutable. Immutable data cannot be modified once created. Immutability seems a bit counterintuitive for a task where we want to coerce our data into the form we want – but it comes together with the concept of transformations. The idea is simple: each immutable dataset can be transformed into another immutable dataset through the use of a transformation function that works on each component of the data. This process helps simplify the data flow, but if you have to make a copy of your data object each time, it can make code a bit brittle as you have to keep track of every attribute of your dataset.”
  • Map takes an array and produces another array which is the result of the callback function being executed on each element in the array.
    var smallData =,i) {return {
    index: i + 1,
    rounded_area: Math.round(d.land_area)
    => {city: “seattle”, state: “WA”, population: 652405, land_area: 83.9}
    {name: “SEATTLE”, index: 1, rounded_area: 84}
  • Filtering: Select a subset of the data using the built in filter method. This creates a new array of data (again see transformation talk above) with only the values that the callback function returns true for.
    var large_land = data.filter(function(d) { return d.land_area > 200; });
    => [{“city”:”new york”,”state”:”NY”,”population”:8405837,”land_area”:302.6},
    {“city”:”kansas city”,”state”:”MO”,”population”:467007,”land_area”:315}]

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s