This repository is a demonstration of visualizing song data using d3.
Initial Code: Python and Beautiful Soup were used to pull popular song keys from Song Key Finder.
Manual Cleanup: Some manual cleanup was performed to remove songs without sufficient data as well as add album and year metadata.
D3 was used as the tool/framework for building the visualization. The goal was to build a simple visual (bar chart), yet add time and animation components.
-Root
--README.md This file.
--index.html Final structure of viz/web page.
--chart.js High level data loading and orchestration of the viz.
--customstyles.css All static css styles, referenced in both html and d3 js code.
--helpers
--structure_builders.js The primary methods for placing any objects onto the canvas.
--dimension.js Helper class for building dimensions and calcs for view less margins.
--data_binding.js Helper class for reading in json data.
--theme.js Static color strings.
--data
--data_pull.py Python program that pulls and writes json data containing song and keys.
--selected_song_data.json Result of program above, after manual cleanup and additions.
--lib
--d3.v5.js Copy of the d3 lib.
--gif
--rhcp-d3.gif Final video result/visualization.