4/5/22, 4:21 PM CSE442: Data Visualization C Ho S me E > R 4 eso4 urc 2 es T O O L S Data Visualization T U T O R I A L S L I N K S Useful Resources Tools Visualization Toolkits
A variety of useful toolkits have been designed to help support information
visualization applications. Some include support for the ful visualization pipeline from
data to interactive graphics, while others focus only on a subset, typical y graphics and interaction.
D3 - A JavaScript library for data-driven DOM manipulation, interaction and
animation. Includes utilities for visualization techniques and SVG generation.
Vega - A declarative language for representing visualizations. Vega wil parse a
visualization specification to produce a JavaScript-based visualization, using either
HTML Canvas or SVG rendering. Vega is particularly useful for creating programs
that produce visualizations as output.
Vega-Lite - A high-level visualization grammar that compiles concise specifications to ful Vega specifications.
Observable Plot - A free, open-source JavaScript library to help you quickly visualize tabular data.
Processing or p5.js - A popular Java-like graphics and interaction language and IDE.
Processing has a strong user community with many examples. p5.js is a sister project for JavaScript.
HTML/JavaScript/XML - use standard web technologies to build the visualization.
You may use libraries such as the Google Maps API to help build your visualization.
Leaflet - a popular open-source mapping library
VTK - A scientific visualization library (C++ with wrappers for other languages) Other Visualization Tools
Tableau for Students - get a free Tableau license as a student
GGplot2 - a graphics language for R
Altair - Jupyter-friendly Python API for Vega-Lite
Seaborn - Python library with nice defaults, built on top of matplotlib Network Analysis Tools
Gephi - an interactive graph analysis application
NodeXL - a graph analysis plug-in for Excel
GUESS - a combined visual/scripting interface for graph analysis
Pajek - another popular network analysis tool
SNAP - graph analysis library for C++ Color Tools
https://courses.cs.washington.edu/courses/cse442/22wi/resources.html 1/3 4/5/22, 4:21 PM CSE442: Data Visualization Color Brewer Home > Resources Adobe Color T O O L S T U T O R I A L S Web Development Tools L I N K S VS Code Sublime Text Webstorm Tutorials & Tips
In addition to our workshops, these tutorials could be useful for your projects and future visualization work. HTML, CSS Basics:
Mozilla Develop Network (HTML, CSS). CSS Zen Garden Extras
Sass is easy to learn and a powerful way to write CSS.
Compass contains a lot of reusable patterns.
Twitter Bootstrap is a popular template. Javascript
Fundamental JavaScript Concepts Mozilla Developer Network
JavaScript Garden is a good reference to language quirks and gotchas.
Eloquent Javascript - free online book by Marijn Haverbeke
A re-introduction to JavaScript (JS Tutorial) on Mozil a Developer Network
JavaScript: The Good Parts - Douglas Crockford
Learning JavaScript Design Patterns by Addy Osmani Debugging:
Learn to use developer tools in your browser, such as Chrome DevTools or Firefox Developer Tools.
Use eslint to avoid syntactic bugs.
JavaScript Application Frameworks
React - Popular application framework
Vue.js - More lightweight application framework
Svelte - Newer framework with reactive variable support
Need an in-memory database for your vis prototype? - try Arquero, Falcon, or crossfilter
Syntax alternatives: TypeScript Git & Github
https://courses.cs.washington.edu/courses/cse442/22wi/resources.html 2/3 4/5/22, 4:21 PM CSE442: Data Visualization Git Tutorials Home > Resources Git Official Docs T O O L S Visual Git Guide T U T O R I A L S A Successful Branching Model L I N K S GitHub
Use GitHub's issue tracker, so you can refer to issues in your commit messages
using # fol owed by issue number.
Working in a team? Use GitHub's Pul Request so you can do code review. GUI
Using git with command line is general y fast but using SourceTree is easier for
reviewing your code before committing or committing a part of your changes
and reduce chances that you wil run a wrong command (such as push wrong branch to master). More Tips
Atomic Commit is a good practice.
Stash is useful when you have unfinished messy things and need to switch
branches to work on something else.
Visualization Blogs and Discussion
Nighingale, The Journal of the Data Visualization Society Data Stories podcast
Visual Cinnamon (Nadieh Bremer) Shirley Wu Chartable, from Datawrapper /r/dataisbeautiful Information is Beautiful Flowing Data
The Functional Art, Alberto Cairo Storytel ing with Data Edward Tufte: Ask E.T. Forum
Visual Business Intel igence by Stephen Few
Statistical Modeling, Causal Inference, and Social Science Visual Complexity
Computer Science & Engineering - University of Washington
https://courses.cs.washington.edu/courses/cse442/22wi/resources.html 3/3