The UNHCR Streamgraph Explorer project was comissioned to provide a new way of viewing and navigating a complex dataset concerning migration of refugees and other persons of concern over time.
The project is Open Source:
https://github.com/unhcr/dataviz-streamgraph-explorer .
The StreamGraph technique was chosen to represent total flows by origin and destination because it has an excellent overview quality. This visualization lets you see at a glance where migrants are coming from and going to over time.
The challenge of this project was to allow the user to explore the full dataset using interactive visualization. The dataset itself contains information about migration flows along many dimensions, including population type, source country, destination country, and year.
The challenge of navigating time was addressed with a context view on the bottom, which affords zooming into particular regions of time via brushing. Hovering over a particular year shows the bar chart for that year on the right, allowing detailed comparisons. Radio buttons allow the user to toggle inclusion of various population types.
Working closely with Cedric Vidonne, a designer at UNHCR, we refined the ideas and developed high fidelity mockups. These gave precise direction for implementing the visualizations, and ensured everyone was on the same page in terms of expected features.
The visualization was implemented based on the structure provided by the high fidelity mockups using the reactive library reactive-model (to handle the data flow between linked views) in conjunction with D3.js.
Perhaps the most powerful interaction in this tool is the ability to filter by origin or destination. For example, clicking on the origin stream for Afghanistan filters the data shown for destionations to only include those coming from Afghanistan. This interaction allows users to fully explore the dataset using interactive visualization.