Skip to content

Instantly share code, notes, and snippets.

@tamc
Created September 15, 2011 08:59
Show Gist options
  • Select an option

  • Save tamc/1218859 to your computer and use it in GitHub Desktop.

Select an option

Save tamc/1218859 to your computer and use it in GitHub Desktop.
D3.js nested data
<!DOCTYPE html>
<html>
<header>
<script src="http://mbostock.github.com/d3/d3.js" type="text/javascript" ></script>
</header>
<body>
<script type='text/javascript'>
function draw(data) {
var lists = d3.select("body").selectAll("ul")
.data(data,function(d,i) { return d.key; })
.enter().append("ul")
.attr("class",function(d) { return d.key })
var lines = lists.selectAll("li")
.data(function(d) { return d.values}, function(d,i) { return d; })
.enter().append("li")
.text(function(d, i) { return d; });
}
draw( [ {key: "apples", values: ["First apple line"] }, {key: "pears", values: ["First pear line"] } ]);
draw( [ {key: "apples", values: ["First apple line"] }, {key: "pears", values: ["First pear line","New second pear line"] } ]);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment