Course NumberCSE 557A
SemesterSpring 2017
HoursTR 11:30AM-1:00PM
LocationRudolph Hall 203
InstructorAlvitta Ottley
Emailalvitta at
OfficeJolley 410
Office HoursTR 1:00PM-2:00PM
TAJosh Landman
Emaillandman at
OfficePsychology 402F
Office HoursMW 1:00PM-2:30PM


Assignment 5: ThemeRiver (Stream Graph)


Visualizing and analyzing time-series data is important for many domains including finance, medicine, climatology and history. In this assignment, you will be using d3 to parse a time-series dataset and visualize the changes over time by using a ThemeRiver.

Basic Requirements

  1. Create or find a time-series dataset
  2. The data format should be exactly the same as the format from assignment 1 (Bar and Line Charts), except that there are now more than 2 columns. This time, the number of columns should be the number of time steps in your time-series data (plus the first column for the name the nominal or ordinal data dimension)

    Keep in mind that just like assignment 1, the first row should be labels.

  3. Implement ThemeRiver
    • Layout the data using the stack layout. A tutorial for the themeRiver in d3 can be found here: version 3 and version 4 .
    • Don't forget to add axes and mark it appropriately with the time steps.
    • As usual, this program needs to be dynamic. It should handle a dynamic number of streams, as well as a dynamic number of time steps in the time-series data.
  4. Implement Hovering
  5. On hover, display a tool tip should highlight the selected stream and display the name of the stream, the closest time step value, as well as the data value at that time step. This should be done in the format of (NameOfStream, timeStep, value).

Extra Credit

  1. Create a Dashboard
  2. While the ThemeRiver makes it easy to see change over time, it is sonmetimes difficult to compare data points for a single time step. Create a Dashboard by adding a secondarcy chart that updates on hover. This can be any chart of your choice. The chart should make facilitate data exploration for a single time step.

  3. Use Current Real World Data
  4. report any interesting findings

  5. Allow the user to re-order the themes in real time.


Submit your work via Blackboard by Friday March 24, 2017, 11:59pm (midnight). Use the naming convention: "FirstnameLastname_a5"(e.g., AlvittaOttley_a5).

Grading Criteria

*Extra credit