Data visualization in JavaScript
- 2. About Me • Software Engineer • M.S. in Computer Engineering • LinkedIn: /wentingzhao • Email: wenting@ZhaoWenting.com • Frisbee ✔ Running ✔ Snorkeling ✔ Go (game)
- 3. Data Visualization • WHAT • WHY • HOW • MORE
- 4. WHAT Data visualization is a high bandwidth connection between data on a computer system and a human brain, facilitated by visual communication. - Source: Data Visualization course provided by UIUC
- 5. Source: San Francisco Bike Parking Lots WHY
- 6. WHY
- 7. HOW
- 8. D3.js • Geographic Bounding Boxes • Force-Directed Graph
- 10. Others • InfoVis: President Obama Budget TreeMap • Hicharts: AAPL Stock Price
- 11. Perspectives > Obtain Data • The server generates the JavaScript for rendering in the HTML • AJAX • Use Web Sockets to have the server directly inject data into client DOM or JavaScript objects (SignalR)
- 12. Perspectives > Data Analysis • Model Thinking vs. Big Data
- 13. Resources • d3js.org • Data Visualization with D3.js (lynda.com) • https://www.coursera.org/course/datavisualization (UIUC) • Model Thinking