Music Map Mashup


Explore the global connection between music and geography with Spotimap, a project by Javier Arce mapping 7,681 songs across 212 cities worldwide.

This post may describe functionality for an old version of CARTO. Find out about the latest and cloud-native version here.
Music Map Mashup

When Sade sang in 'Smooth Operator' -- "Coast to coast  LA to Chicago" -- she obviously hadn't consulted a map.

For starters  L.A. - Los Angeles (not to be confused by the abbreviation of Louisiana  a southern U.S. state) is on the coast but what about Chicago? Only if you count the coast of Lake Michigan.

After my careful scrutiny of Sade's entire discography  I began to wonder about how I've been using geography to engage with music. In recent conversation with a friend  I came up with a not too accurate theory on the origins of American Jazz. It is surprisingly global and geographically spatial. My colleague Javier Arce from CartoDB is one step ahead of me with his awesome [Spotimap].

Javier cataloged on his Spotimap  7 681 songs and 212 cities across the globe using the songs listed in the Wikipedia article "List of songs about cities."

To create this map Javier extracted a list of the cities with their respective countries and created a table. Then he geocoded that table to get the position of each city on the map.

Next  he extracted all the song information in the main article using regular expressions and infinite amounts of patience. It generated a CSV file that he imported into his CartoDB account. Javier ended up having a table that contained the name of the song  the author  and the city.

He repeated the same process for many of the cities listed in the article that have their own page. For example  Berlin. This was a little tedious because each list has a slightly different formatting. Javier had to modify the regular expression or fix some mistakes by hand and in some cases used Open Refine to spot and correct problems with the data.

After that process was finished  Javier got two tables. One for the songs and one for the cities:





Finally  Javier used the CartoDB JavaScript library cartodb.js  the Spotify API and their Play Button Widget to create the map.

The styling is pretty simple. There are just two layers. One for the cities  indicated by a green  beamed eighth note icon and another one with the countries (which is a Choropleth map created with the CartoDB wizard).

And the geospatial queries are very straightforward too. Since both the 'songs table' and the 'cities table' use the notation for the name of the city  Javier used that as a key to join both tables:

 spotimap_cities cities  
 spotimap_songs songs
 songs.available IS NOT false

You can find all the information related to the map  the sources  and the code on his GitHub account: