0
Data Viz 101
1. Get the data
1. Get the data2. Parse the data into useful Objects
1. Get the data2. Parse the data into useful Objects3. Render the objects on screen
1. Get the data
CSV, JSON, XML
JSON               XML                CSV   FlexibleStructured      Easy
CSV (Comma-Separated Values)  • Values (columns) are typically delimited by commas  • Rows are typically delimited by carr...
4,14,26,17,98,35,128,362,9,18,45       dave,28,male,no       erica,28,female,no       roger,52,male,yes
XML (eXtensible Markup Language)  • Data is stored in nested nodes  • Structure of data is extremely flexible to define    b...
<patients> <patient name=”dave” age=28 gender=”male” smoker=”no”/> <patient name=”erica” age=28 gender=”female” smoker=”no...
JSON (JavaScript Object Notation)   • Data is as JavaScript Objects   • Extraordinarily flexible and lightweight   • Lack o...
{    patients:[       {name:”dave”, age:28, gender:”male”, smoker:false},       {name:”erica”, age:28, gender:”female”, sm...
JSON   JAVA
{     Curly Braces - OBJECT};
[ Square Brackets - ARRAY ]
{     name:”Peter”,     age:18,     smoker:false,     friends:[“April”, “Ron”, “Valerie”]};
{     name:”Peter”,     age:18,     smoker:false,     friends:[“April”, “Ron”, “Valerie”]};        myJSONObject.age
{     name:”Peter”,     age:18,     smoker:false,     friends:[“April”, “Ron”, “Valerie”]};     myJSONObject.friends[1]
{     name:”Peter”,     age:18,     smoker:false,     friends:[“April”, “Ron”, “Valerie”]};     myJSONObject.getInt(“age”);
{          name:”Peter”,          age:18,          smoker:false,          friends:[“April”, “Ron”, “Valerie”]     };JSONAr...
myJSONObject = new JSONObject(stringData);JSONArray a = myJSONObject.getJSONArray[“friends”];println(a.getString(1));
try {  myJSONObject = new JSONObject(stringData);  JSONArray a = myJSONObject.getJSONArray[“friends”];  println(a.getStrin...
try {   String url = “http://test.com/?getStuff”;  String stringData = join(loadStrings(url), “”);  myJSONObject = new JSO...
http://www.blprnt.com/processing/json.zip
Where’s the data?
1. Find some data2. Ask some questions
1. Ask some questions   2. Find some data
3. Render the objects on screen
<insert wisdom here>
position      size#    colour    rotation     sound        ?
position              size#   map()    colour            rotation             sound                ?
map(5,0,10,0,100)   50
map(5,0,10,0,1000)   500
map(5,0,10,20,30)   25
Data Representation - Day 2
Data Representation - Day 2
Upcoming SlideShare
Loading in...5
×

Data Representation - Day 2

434

Published on

Course notes for my ITP Data Representation Class. Probably not overly useful for people who didn't listen to the lecture.

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
434
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
11
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • Transcript of "Data Representation - Day 2"

    1. 1. Data Viz 101
    2. 2. 1. Get the data
    3. 3. 1. Get the data2. Parse the data into useful Objects
    4. 4. 1. Get the data2. Parse the data into useful Objects3. Render the objects on screen
    5. 5. 1. Get the data
    6. 6. CSV, JSON, XML
    7. 7. JSON XML CSV FlexibleStructured Easy
    8. 8. CSV (Comma-Separated Values) • Values (columns) are typically delimited by commas • Rows are typically delimited by carriage returns • Works for most data that can go in a simple spreadsheet • Not good for any kind of complex or relational data • Processing doesn’t have built in support for CSV but we can use JAVA libraries like opencsv
    9. 9. 4,14,26,17,98,35,128,362,9,18,45 dave,28,male,no erica,28,female,no roger,52,male,yes
    10. 10. XML (eXtensible Markup Language) • Data is stored in nested nodes • Structure of data is extremely flexible to define but not as flexible to change • Processing has built-in support for XML • Many APIs will return data in XML format
    11. 11. <patients> <patient name=”dave” age=28 gender=”male” smoker=”no”/> <patient name=”erica” age=28 gender=”female” smoker=”no”/> <patient name=”roger” age=52 gender=”male” smoker=”yes”/></patients>
    12. 12. JSON (JavaScript Object Notation) • Data is as JavaScript Objects • Extraordinarily flexible and lightweight • Lack of named structures can make stored data difficult to understand • JAVA and JavaScript do not play as nicely as you might think
    13. 13. { patients:[ {name:”dave”, age:28, gender:”male”, smoker:false}, {name:”erica”, age:28, gender:”female”, smoker:false}, {name:”roger”, age:52, gender:”male”, true} ]}
    14. 14. JSON JAVA
    15. 15. { Curly Braces - OBJECT};
    16. 16. [ Square Brackets - ARRAY ]
    17. 17. { name:”Peter”, age:18, smoker:false, friends:[“April”, “Ron”, “Valerie”]};
    18. 18. { name:”Peter”, age:18, smoker:false, friends:[“April”, “Ron”, “Valerie”]}; myJSONObject.age
    19. 19. { name:”Peter”, age:18, smoker:false, friends:[“April”, “Ron”, “Valerie”]}; myJSONObject.friends[1]
    20. 20. { name:”Peter”, age:18, smoker:false, friends:[“April”, “Ron”, “Valerie”]}; myJSONObject.getInt(“age”);
    21. 21. { name:”Peter”, age:18, smoker:false, friends:[“April”, “Ron”, “Valerie”] };JSONArray a = myJSONObject.getJSONArray[“friends”];a.getString(1);
    22. 22. myJSONObject = new JSONObject(stringData);JSONArray a = myJSONObject.getJSONArray[“friends”];println(a.getString(1));
    23. 23. try { myJSONObject = new JSONObject(stringData); JSONArray a = myJSONObject.getJSONArray[“friends”]; println(a.getString(1));} catch (Exception e) { println(“JSON LOAD FAILED.”);}
    24. 24. try { String url = “http://test.com/?getStuff”; String stringData = join(loadStrings(url), “”); myJSONObject = new JSONObject(stringData); JSONArray a = myJSONObject.getJSONArray[“friends”]; println(a.getString(1));} catch (Exception e) { println(“JSON LOAD FAILED.”);}
    25. 25. http://www.blprnt.com/processing/json.zip
    26. 26. Where’s the data?
    27. 27. 1. Find some data2. Ask some questions
    28. 28. 1. Ask some questions 2. Find some data
    29. 29. 3. Render the objects on screen
    30. 30. <insert wisdom here>
    31. 31. position size# colour rotation sound ?
    32. 32. position size# map() colour rotation sound ?
    33. 33. map(5,0,10,0,100) 50
    34. 34. map(5,0,10,0,1000) 500
    35. 35. map(5,0,10,20,30) 25
    1. A particular slide catching your eye?

      Clipping is a handy way to collect important slides you want to go back to later.

    ×