Data and data visualization - Caitlin Morris · Exercise • Find a data set that’s interesting...
Transcript of Data and data visualization - Caitlin Morris · Exercise • Find a data set that’s interesting...
![Page 1: Data and data visualization - Caitlin Morris · Exercise • Find a data set that’s interesting to you and identify its structure and key properties • Create a graph visualization](https://reader036.fdocuments.in/reader036/viewer/2022070802/5f02c2c27e708231d405e0d5/html5/thumbnails/1.jpg)
Data and data visualization
![Page 2: Data and data visualization - Caitlin Morris · Exercise • Find a data set that’s interesting to you and identify its structure and key properties • Create a graph visualization](https://reader036.fdocuments.in/reader036/viewer/2022070802/5f02c2c27e708231d405e0d5/html5/thumbnails/2.jpg)
Data formats• Data can come packaged in many structures and
formats!
• Some of the most common:
• CSV (Comma Separated Values)
• JSON (JavaScript Object Notation)
• XML (eXtensible Markup Language)
![Page 3: Data and data visualization - Caitlin Morris · Exercise • Find a data set that’s interesting to you and identify its structure and key properties • Create a graph visualization](https://reader036.fdocuments.in/reader036/viewer/2022070802/5f02c2c27e708231d405e0d5/html5/thumbnails/3.jpg)
CSV (Comma Separated Values)
• Commonly exported from spreadsheets and table-type documents
• Treated as a table
![Page 4: Data and data visualization - Caitlin Morris · Exercise • Find a data set that’s interesting to you and identify its structure and key properties • Create a graph visualization](https://reader036.fdocuments.in/reader036/viewer/2022070802/5f02c2c27e708231d405e0d5/html5/thumbnails/4.jpg)
XML
![Page 5: Data and data visualization - Caitlin Morris · Exercise • Find a data set that’s interesting to you and identify its structure and key properties • Create a graph visualization](https://reader036.fdocuments.in/reader036/viewer/2022070802/5f02c2c27e708231d405e0d5/html5/thumbnails/5.jpg)
JSON
• “JavaScript Object Notation”
• Friendly to work with in JavaScript because the structure uses standard JS object and array formatting for access
![Page 6: Data and data visualization - Caitlin Morris · Exercise • Find a data set that’s interesting to you and identify its structure and key properties • Create a graph visualization](https://reader036.fdocuments.in/reader036/viewer/2022070802/5f02c2c27e708231d405e0d5/html5/thumbnails/6.jpg)
JSON Structure
![Page 7: Data and data visualization - Caitlin Morris · Exercise • Find a data set that’s interesting to you and identify its structure and key properties • Create a graph visualization](https://reader036.fdocuments.in/reader036/viewer/2022070802/5f02c2c27e708231d405e0d5/html5/thumbnails/7.jpg)
JSON Structure
![Page 8: Data and data visualization - Caitlin Morris · Exercise • Find a data set that’s interesting to you and identify its structure and key properties • Create a graph visualization](https://reader036.fdocuments.in/reader036/viewer/2022070802/5f02c2c27e708231d405e0d5/html5/thumbnails/8.jpg)
JSON Structure
![Page 9: Data and data visualization - Caitlin Morris · Exercise • Find a data set that’s interesting to you and identify its structure and key properties • Create a graph visualization](https://reader036.fdocuments.in/reader036/viewer/2022070802/5f02c2c27e708231d405e0d5/html5/thumbnails/9.jpg)
JSON Structure
![Page 10: Data and data visualization - Caitlin Morris · Exercise • Find a data set that’s interesting to you and identify its structure and key properties • Create a graph visualization](https://reader036.fdocuments.in/reader036/viewer/2022070802/5f02c2c27e708231d405e0d5/html5/thumbnails/10.jpg)
Loading JSON data
![Page 11: Data and data visualization - Caitlin Morris · Exercise • Find a data set that’s interesting to you and identify its structure and key properties • Create a graph visualization](https://reader036.fdocuments.in/reader036/viewer/2022070802/5f02c2c27e708231d405e0d5/html5/thumbnails/11.jpg)
Accessing object properties
![Page 12: Data and data visualization - Caitlin Morris · Exercise • Find a data set that’s interesting to you and identify its structure and key properties • Create a graph visualization](https://reader036.fdocuments.in/reader036/viewer/2022070802/5f02c2c27e708231d405e0d5/html5/thumbnails/12.jpg)
Using object properties
![Page 13: Data and data visualization - Caitlin Morris · Exercise • Find a data set that’s interesting to you and identify its structure and key properties • Create a graph visualization](https://reader036.fdocuments.in/reader036/viewer/2022070802/5f02c2c27e708231d405e0d5/html5/thumbnails/13.jpg)
Loading from URL
![Page 14: Data and data visualization - Caitlin Morris · Exercise • Find a data set that’s interesting to you and identify its structure and key properties • Create a graph visualization](https://reader036.fdocuments.in/reader036/viewer/2022070802/5f02c2c27e708231d405e0d5/html5/thumbnails/14.jpg)
Steps for working with data
• Find a data source! Here’s a good resource, there are many options: https://github.com/toddmotto/public-apis
• Format the data and understand its structure
• Look through the data and find the most relevant information: name, format, organization
![Page 15: Data and data visualization - Caitlin Morris · Exercise • Find a data set that’s interesting to you and identify its structure and key properties • Create a graph visualization](https://reader036.fdocuments.in/reader036/viewer/2022070802/5f02c2c27e708231d405e0d5/html5/thumbnails/15.jpg)
Exercise
• Find a data set that’s interesting to you and identify its structure and key properties
• Create a graph visualization using data from that set. This can be either a static graph (bar, line, circle), or something dynamic and animated.