我有一个包含音乐相关数据(元数据)的CSV文件。数据结构如下所示: 类型,艺术家,曲目
类型是第一类,艺术家第二类意味着类型有很多艺术家,因此艺术家可能有很多歌。
这是我的代码:
var dataset = d3.csv("musictrackstiny.csv", function(musicdata){
var genre=d3.nest()
.key(function(d) {return d.genre;})
.sortKeys(d3.ascending)
.entries(musicdata);
var g=svg.selectAll("g").data(musicdata).enter()
.append("g")
.attr("transform",function(d,i) {return "translate("+(120*i)+",0)";});
g.append("rect")
.attr("x",cmargin)
.attr("y",cmargin)
.attr("width",cwidth-2*cmargin)
.attr("height",cheight-2*cmargin)
.append("title")
.text(function(d) {return d.genre;})
g.append("text")
.attr("y",cheight+10)
.attr("x",cmargin)
.text(function(d) {return d.genre;})
问题是即使我使用genre
函数,我在显示中看到很多重复的keys
条目。
我的最终目标是将一个树/图表作为第一个节点,然后Artists
作为其子节点。使用矩形的当前显示是测试该概念是否有效。请注意,将有许多与歌曲相关的流派和艺术家。我希望有这样的树结构: