Assignment #3: Interactive Design
How have congressional district party affiliations changed throughout time?
Rationale
For this project, I wanted to create some form of map that changed with respect to time. The dataset I selected was U.S. geopolitical data relating to congressional districts; this presented a few requirements for visual encoding and interactivity:
- An interactive method to scroll through time needs to be available and easy to use
- Political parties for each district needs to be visually encoded and easy to interpret
- Relative voting power for each district needs to be visually encoded
- An interactive method to view a district's detailed information on demand
To satisfy these requirements, I did the following:
- Defined thicker stroke widths to states and land borders, and thinner for district borders
- Encoded two main political parties in congressional districts with their color (Blue Democrats,
Red Republicans, Gray other)
- Added a legend to map political party colors to their respective name
- Encoded relative voting power for each congressional district by shading the alpha channel
- A tooltip when hovering over a congressional district that supplies details-on-demand
- Added an interactive/controllable slider that controls time
Development Process
I chose to not have any team members, as I was more interested in learning every component of this project. The development process was very agile - there was a significant amount of tweaking various encoding variables (color, shading normalization, stroke thickness, etc).
Overall, the project took approximately 14 hours to execute, which is broken down into more detail below:
- 2 hours thinking of a question that has a usable dataset
- 1 hour sourcing geographic and political datasets for the past 4 decades
- 3 hours converting, simplifying, and applying quantization to geographic map datasets
- 6 hours building a visualization
- 2 hours formatting and writing up report
Geographic congressional district data was sourced from University of California, Los Angeles's United States Congressional District Shapefiles,
which provided the districts in ERSI shapefiles.
Historical candidate and political party affiliations were sourced from MIT
Election Data's dataset.
The most significantly difficult part of the assignment was obtaining geopolitical map data for the past 4 decades and converting it to a format that was useful. The sourced map data was over 2 GiB before I processed it; at the end, it was 26 MiB, and 1.2 MiB when GZIP compressed by NGINX on GitHub pages. This dataset can be further compressed by storing only distinct congressional districts, as some districts were valid for multiple congressional elections. With more time spent on the project, geopolitical map data and candidate history could have been highly optimized and compressible.
This visualization is not very performant in browsers due to unoptimized transitions between years; it re-renders all districts, even though they might not have changed. As such, certain features, such as zooming and panning, were cut out due to how CPU intensive they were.