Take the 2-minute tour ×

I have a CSV file with music related data (metadata). The data structure looks like this: Genre, Artist, Track

Genre is first category, Artist is second meaning that a Genre has many artists, and so an Artist may have many songs.

Here is my code:

var dataset = d3.csv("musictrackstiny.csv", function(musicdata){    

var genre=d3.nest()
  .key(function(d) {return d.genre;})

var g=svg.selectAll("g").data(musicdata).enter()
    .attr("transform",function(d,i) {return "translate("+(120*i)+",0)";});

      .text(function(d) {return d.genre;})


The problem is I see many duplicates genre entries in the displays even though I am using the keys function.

My end objective is to have a tree/graph with genre as a first node and then Artists as its child. The current display using rectangles is to test that concept works. Please note that there will be many genres and artists associated with the songs. I am looking to have a tree structure like this:


share|improve this question
just quickly looking at your code - you build a nested data structure and then pass in the original musicdata. Plus for the .data() you should pass the key as the second argument. link –  imrane Oct 4 '12 at 3:40

Your Answer



Browse other questions tagged or ask your own question.