Jeannine

@jeannineshiu·2 public vizzes

Fork of Stylized Bar Chart - Top 100 Songs Of Spotify

This visualization shows the danceability of the top 100 Spotify songs from 2018, ordered by artist, with each horizontal bar representing a song’s danceability score. The chart uses React for rendering and d3.scaleBand and d3.scaleLinear for positioning, with marks drawn as SVG rectangles. The data is loaded via d3.csv from a GitHub-hosted dataset, and axes are constructed using custom components that map scale domains to tick elements. The chart is filtered to display the first 60 songs in the dataset.

Nov 22, 2022

Loading thumbnail…

Fork of Top 100 Songs w/ Menus

A scatterplot maps two selectable song attributes against each other for the top 100 Spotify tracks of 2018, with dropdown menus choosing danceability, energy, or other numeric features for the X and Y axes. Using React and D3 v5, the interactive chart renders circles as SVG marks with tooltips and scales axes via `scaleLinear`. The data is loaded as CSV from a GitHub gist, while reusable components like `AxisBottom`, `AxisLeft`, and `Marks` handle the visualization, and `ReactDropdown` provides the menu controls.

Nov 22, 2022