A dynamic beeswarm graph to showcase the timeline of protests around the world.
All the code used to create the visualization is present in the main Github page, layout.html being the html code that implements that visualization, the code v2Beeswarm.js and tooltip_plugin.js generating the graphs with the data being pulled from reduced_protest_dataV2.csv. The folder Previous Versions includes past versions of code and data files that are currently not in use while the Code Sample folder holds short files that included snippets of code that were used to incorporate various features piecemeal over time.
- Utilized Figma to create a mockup/prototype of visualization
- Utilized guidelines from IBM's Carbon Design System for data visualization color palletes to ensure that the visualization is accessible
- Utilized Observable to expedite the process of creating visualization code
https://shivalimani.github.io/Final-Project-CS4804/index.html
https://www.loom.com/share/b8fed780439b40e29c6893788d7b25d7
- This final project is adapted from https://www.dataviscourse.net/2020/project/
- Data for this project was sourced from https://dataverse.harvard.edu/dataverse/MMdata
- Observable was used to code much of the visualization
- The code used was based on the mirrored beeswarm graph example on Observable at https://observablehq.com/@d3/beeswarm-mirrored/2
- The code for the tooltip was sourced from an Observable notebook by Mike Freeman at https://observablehq.com/@mkfreeman/plot-tooltip