Creative Technology - Design Challenge #8
Use p5.js visualize a data set that is of interest to you.
I tested out a lot of different data sets that I could visualize for this project. I started trying to visualize data about college football, then I moved on to data about the arctic ice extents. Both of those data sets were poorly formatted and difficult to work with though, so I settled on visualizing data about the top 1000 most populous US cities. The data set I found included information about the population of the cities in the year 2013, as well as their change in population since the year 2000.
With the data I had, I decided to make three different visualizations built into one, which a user would be able to navigate through. The first option would be to compare the populations of each city. Another option is to see how much each city’s population has grown since 2000. The final option is to show only the city’s that have decreased in population since 2000.
Given that I was using geographical data, I thought it would be interesting to plot the data as a map. Each city is plotted as a circle with its center at the cities latitude and longitude. The size of the circle would change depending on which visualization option was being displayed. The circle colors also change to help illustrate what value is being shown.
I built in GUI elements, to assist the user in navigating the visualizations and to display the data about individual cities. There are three buttons to navigate between the three visualization options. The user also has the ability to select any of the cities, and the data about that city is then displayed numerically.
