Day 121 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:

D3 nesting examples

  • Went through – wrote out by hand with comments and made a cheat sheet for work.

Learn JS Data Strings (using lodash)

  • How to Strip Whitespace Example
    • d3.csv(“example.csv”, function(data) {
    •                 var cleaned = data.map(function(d) {
    •                 d3.keys(d).forEach(function(k) {
    •                                 cleanD[_.trim(k)] = _.trim(d[k]);
    •                                 });
    •                 return cleanD;
    •                 });
    • });
  • Find and Replace example using indexOfconsole.log(“A man, a plan, a canal”.indexOf(“man”) !== -1);
    • => true
    • console.log(“A man, a plan, a canal”.indexOf(“panama”) !== -1;
    • => false
    • indexOf is used to perform search with passed substring.  -1 is returned if sub-string can’t be found.  use this to build a string finder
    • console.log(“A man, a plan, a canal”.place(“cancel”, “”));
    • => “A man, a plan, a”
  • Templating Example
    • To avoid using two many string escapes
    • var templateString = “div class=’person'” +
    •                 ”  <span class=’name’><$=name $></span” +
    •                 ”  <spsan class=’occupation’><%=occupation %></span>” +
    •                 “</div>”;

Reading and Learning Data Visualization Theoretically/Critically:

The Functional Art: An Introduction to Information Graphics and Visualization by Alberto Cairo

p36-52 Forms and Functions: Visualization as Technology

Three Takeaways

  • Anticipate how readers will try to re-organize numbers in their head and take that sorting out for them p 38
  • People are not good at comparing service areas eg bubbles p 41
  • Abstraction-Figuration -> an infographic is more figurative when the relationship between the referent and its representation are more mimetic.  The more unlike its referent, the more abstract it is.  eg infographic with a realistic illustration of a person is less abstracted than a stick figure p 52
Advertisements

Leave a Reply

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

WordPress.com Logo

You are commenting using your WordPress.com 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 )

Google+ photo

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

Connecting to %s