Spotify Tracks Dataset Visualization

This is a simple data visualization project that visualizes the Spotify Tracks Dataset from Kaggle.

The demo of the website can be viewed here .

This project is created using vanilla javascript, D3.js, and Bootstrap.

System Introduction

The figure here shows a preview of the entire system.

We introduce them section by section.

A. Filtering

By clicking on the Filter button on the upper right corner, it shows a sidebar where we can perform various modifications to the dataset.

1. Selecting interested genres

By clicking on the dropdown, we can select genres that we are interested in to visualize and compare.

2. Sorting the data

Then, we can choose to sort the data according to any of the numerical attributes and decide the ascending or descending order.

3. Selecting the TOP N% rows of each genre

In order to perform in-depth analysis, we can drag the bar below to decide how much data do we want to view.

We have selected the top 30% tracks according to popularity (the top 30% popular) of each genre.

By modifying the filter, we can gain several insights about the data.

B. Single Genre Analysis

In this section, we can choose to observe the properties of a single genre.

By selecting the genre in the dropdown:

different views will be shown:

1. Histogram of Numerical Attributes

The histogram serves as a tool to see the different distributions of a certain feature with respect to a genre.

For example, we can see that the classical music genre has high acousticness.

However, it does not have high energy.

2. Count of each key and mode

We can see that a large portion of popular classical music is composed in major scales, and scales with sharps # (升記號) are quite common too. D major is the most popular in classical music, which matches my perception, since it is common explained that D major sounds like the music from heaven (in the west), which makes us closer to god.

3. Pie chart showing the number of songs with explicit lyrics

For “single” genres, we show the pie chart of the number of song that include explicit lyrics. for the all-genres category, we show a separate chart that we will explain later.

There are no songs with explicit lyrics in the classical music genre.

Where j-rock consists of some.

C. Cross Genre Analysis and Visualization

1. Violin Plot for Numerical Distribution Analysis

I am interested in the distribution of different feature and attributes among genres, thus I created a violin chart to do so.

We can see that valence is an interesting feature to observe:

valence: A measure from 0.0 to 1.0 describing the musical positiveness conveyed by a track. Tracks with high valence sound more positive (e.g. happy, cheerful, euphoric), while tracks with low valence sound more negative (e.g. sad, depressed, angry).

We can see that popular mandopop (國語流行音樂) has a relatively lower valence, which shows that the Taiwanese and Chinese typically like to write sad music more. And for the Japanese, their distribution is much higher.

2. Radar Plot for Averaged Statistics

For the genres that I have selected, we can see that they differ quite a lot in the radar plot. Classical music feature the most acousticness, while japanese music mostly have a lot of energy. The common part among all is that most of the tracks selected have a quite danceability.

3. Top 20 genres in the selected portion of “all-genres”

This plot is only available if we chose “all-genres” to analyze individually.

Since we have selected the top 30% popular tracks, and we have chose to visualize all genres, we can actually count the number of each genre in the selection, and list the top 20 genres that made it into the list.

In this plot, we can see that the tracks that made into the top 30% list come from pop-film, chill, and k-pop.

If we changed the filter a bit, which is as follows:

We select the top 1% of tracks that has the most valence (most cheerful and happy), the results are quite interesting.

We can see that children music are the ones that are the most happy. And for all genres, music that are cheerful (with high valence) usually has higher energy (top left corner).

Feel free to check out the application!