JavaScript Data Visualization Project

project.txt

Project: JavaScript Data Visualization

The purpose of this project is to find some interesting data, display that data in JS, give users a way to do calculations on it, and visualize it using graphics libraries and/or APIs.

    Create a folder for the project.
    Initialize a git repository for the project and create a Github repo for it, so that you can push commits to the remote Github repo. Commit for each stage of the project (or even more often than that, if you’d like)
        See slides: Git
    Find an interesting dataset in some sort of text format (XML, JSON, CSV, etc). Store the dataset in your project folder. Truncate it to a reasonable length if it’s very long (i.e. 1000 rows). Some possible sources are:
        https://explore.data.gov/
        http://www.usgovxml.com/
        http://geocommons.com/
    Create an empty webpage and load the dataset into your webpage using an AJAX or JSONP request.
        See slides:  AJAX/JSONP
    Display the data as a <table> with columns for each of the attributes.
        See slides: HTML Tables
    Use the tablesorter jQuery plugin to make the table sortable.
        See slides: JS Libraries
    Create a form above the table which lets users filter or manipulate the data somehow, i.e. a dropdown box to only show rows matching a particular query, or a way of summing up attributes. Whatever would be useful with the data.
        See slides: JS DOM, JS Events
    Use the High Charts JS library to visualize a numerical aspect of the data.
    If the data has a geographical aspect (locations), use the Google Maps API to plot it on a map.
        See slides: JS APIs
    Use Twitter Bootstrap on the site to make it prettier, styling the buttons and table.

See slides: CSS Tools & Techniques