U.S. Import and Export Visualization

Setup Instructions

Copy all files into a common folder of a webserver. A listing of all files is given below.

Browse to index.htm using a W3C standards compatible browser (we suggest using Chromium). An internet connection from the client is required.

List of files


The website with the visualization is available here. See the Help tab on what features are available and the map key.

Development progress

Development findings (special picks)

Just because you use a library doesn't mean the work is done. We found that the time spent to customize the library feature is unfortunately non-negligible. Also some features such as coloring individual strands in the sankey chart are simply not available.

There is generally the question of how to aggregate data when selecting multiple states/years on a map. Since drawing zoomable mini-charts inside a country is not easily possible with the library's functionality, we thus resorted to adding the numbers together to generate a compound value that is used to color the country.

We used git as source control tool, this proved to be a good decision and made life at merging much easier. Two of the three team members were new to git.

Used libaries

Google Visualization API All graphs and charts rely on the Google Visualization API for rendering.

jQuery As base javascript framework, jQuery is used. This makes it easy to capture and process events.

chosen A widget for tag lists.

Raw Data Google visualization tables are used. The also allow users to sort the data.