Processing & Dataviz

1,604 views

Published on

Slides from my Processing & Data VIsualization workshop. Probably won't make a great deal of sense to those of you who haven't attended.

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

No Downloads
Views
Total views
1,604
On SlideShare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
38
Comments
0
Likes
2
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
  • Processing & Dataviz

    1. 1. “this is going to be AWESOME!"
    2. 2. & Data Visualization
    3. 3. Why ?
    4. 4. complex interactiveexploratory novel
    5. 5. 1. Get the data into Processing
    6. 6. 1. Get the data into Processing2. Parse the data into useful Objects
    7. 7. 1. Get the data into Processing2. Parse the data into useful Objects3. Render the objects on screen
    8. 8. CSV, JSON, XML
    9. 9. 1. Get the data into Processing
    10. 10. JSON XML CSV FlexibleStructured Easy
    11. 11. 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
    12. 12. 4,14,26,17,98,35,128,362,9,18,45 dave,28,male,no erica,28,female,no roger,52,male,yes
    13. 13. 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
    14. 14. <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>
    15. 15. 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
    16. 16. { patients:[ {name:”dave”, age:28, gender:”male”, smoker:false}, {name:”erica”, age:28, gender:”female”, smoker:false}, {name:”roger”, age:52, gender:”male”, true} ]}
    17. 17. { Curly Braces - OBJECT};
    18. 18. [ Square Brackets - ARRAY ]
    19. 19. { name:”Peter”, age:18, smoker:false, friends:[“April”, “Ron”, “Valerie”]};
    20. 20. { name:”Peter”, age:18, smoker:false, friends:[“April”, “Ron”, “Valerie”]}; myJSONObject.age
    21. 21. { name:”Peter”, age:18, smoker:false, friends:[“April”, “Ron”, “Valerie”]}; myJSONObject.friends[1]
    22. 22. { name:”Peter”, age:18, smoker:false, friends:[“April”, “Ron”, “Valerie”]}; myJSONObject.getInt(“age”);
    23. 23. { name:”Peter”, age:18, smoker:false, friends:[“April”, “Ron”, “Valerie”] };JSONArray a = myJSONObject.getJSONArray[“friends”];a.getString(1);
    24. 24. myJSONObject = new JSONObject(stringData);JSONArray a = myJSONObject.getJSONArray[“friends”];println(a.getString(1));
    25. 25. try { myJSONObject = new JSONObject(stringData); JSONArray a = myJSONObject.getJSONArray[“friends”]; println(a.getString(1));} catch (Exception e) { println(“JSON LOAD FAILED.”);}
    26. 26. 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.”);}
    27. 27. http://www.blprnt.com/processing/json.zip
    28. 28. 2. Parse the data into useful Objects
    29. 29. class Patient { XML String name; int age;JSON String gender; ArrayList<Patient> patientList boolean smoker; CSV Patient(); }
    30. 30. ArrayList: Store lists of objectsHashMap: Keep counts of categories
    31. 31. Arrays vs. ArrayLists
    32. 32. Arrays fast easy to usegood for known quantities
    33. 33. ArrayLists flexible full-featuredgood for changing quantities
    34. 34. Basic ArrayLists ArrayList myList = new ArrayList(); CheeseBurger cb = new CheeseBurger(); myList.add(cb);
    35. 35. Basic ArrayLists CheeseBurger cb = myList.get(0); cb.eat();
    36. 36. Basic ArrayLists CheeseBurger cb = myList.get(0);X cb.eat();
    37. 37. Basic ArrayLists CheeseBurger cb = (CheeseBurger) myList.get(0); cb.eat();
    38. 38. ArrayLists w/ Generics ArrayList<CheeseBurger> myList = new ArrayList(); CheeseBurger cb = new CheeseBurger(); myList.add(cb);
    39. 39. ArrayLists w/ Generics CheeseBurger cb = myList.get(0);√ cb.eat();
    40. 40. HashMaps
    41. 41. HashMapsStore objects by a keyHelpful for keeping counts of categoriesUseful for keeping checklists
    42. 42. HashMapsHashMap<keyType, valueType>myMap = new HashMap();CustomObject o = new CustomObject();myMap.put(key, o);CustomObject o = myMap.get(key)
    43. 43. 3. Render the objects on screen
    44. 44. <insert wisdom here>
    45. 45. position size# colour rotation sound ?
    46. 46. position size# map() colour rotation sound ?
    47. 47. map(5,0,10,0,100) 50
    48. 48. map(5,0,10,0,1000) 500
    49. 49. map(5,0,10,20,30) 25

    ×