Skip to content

Instantly share code, notes, and snippets.

@njvack
Created November 15, 2012 18:35
Show Gist options
  • Save njvack/4080338 to your computer and use it in GitHub Desktop.
Save njvack/4080338 to your computer and use it in GitHub Desktop.
Circle packing, study data
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<style>
text { font: 10px sans-serif; }
</style>
</head>
<body>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script>
function childrify(h) {
var childs = []
d3.entries(h).forEach(function(e) {
childs.push({"packageName": null, "className":e.key, "value": e.value.budget_dollars, "thing": e});
});
return childs;
}
var diameter = 960;
var color = d3.scale.category10();
var bubble = d3.layout.pack()
.sort(null)
.size([diameter, diameter])
.padding(1.5);
var root = {
"name": "flare",
"children": null
}
var svg = d3.select("body").append("svg")
.attr("width", diameter)
.attr("height", diameter);
d3.json("studies.json", function(err, studies) {
root.children = childrify(studies)
var dataz = bubble.nodes(root);
console.log(dataz);
var node = svg.selectAll(".node")
.data(dataz.filter(function(d) { return !d.children }))
.enter().append("g")
.attr("class", "node")
.attr("transform", function(d) { return "translate("+d.x+","+d.y+")"})
node.append("circle")
.attr("r", function(d) {return d.r})
.attr("fill", function(d) { return color(d.thing.value.group)});
node.append("text")
.attr("dy", "0.3em")
.style("text-anchor", "middle")
.text(function(d) { return d.className });
node.append("text")
.attr("dy", "1.8em")
.style("text-anchor", "middle")
.text(function(d) { return d.thing.value.scanned_n+"/"+d.thing.value.planned_n });
});
d3.select(self.frameElement).style("height", diameter + "px");
</script>
</body>
</html>
{
"MIDUS2": {
"budget_dollars": 1000000,
"people": ["Richie D", "Stacey S", "Luke H", "Lauren H"],
"planned_n": 200,
"scanned_n": 2,
"funding": "midus",
"group": "bi"
},
"NCCAM3": {
"budget_dollars": 2000000,
"people": ["Richie D", "David B", "David P", "Melissa R", "X", "Y", "Z"],
"planned_n": 160,
"scanned_n": 0,
"funding": "pending",
"group": "cihm"
},
"self_other": {
"budget_dollars": 50000,
"people": ["Richie D", "Drew F", "Nate V", "Abigail F"],
"planned_n": 40,
"scanned_n": 40,
"funding": "templeton",
"group": "cihm"
},
"savor_ema": {
"budget_dollars": 50000,
"people": ["Richie D", "Aaron H", "Nate V", "Eric W", "Kaitlyn M"],
"planned_n": 40,
"scanned_n": 40,
"funding": "templeton",
"group": "lan"
},
"asthma3": {
"budget_dollars": 100000,
"people": ["Richie D", "Melissa R"],
"planned_n": 30,
"scanned_n": 0,
"funding": "pending",
"group": "cihm"
},
"veterans": {
"budget_dollars": 200000,
"people": ["Richie D", "Jack N", "Andrea H", "Dan G", "Joe W"],
"planned_n": 45,
"scanned_n": 20,
"funding": "NIH 49823982.23489",
"group": "cihm"
},
"gates": {
"budget_dollars": 1000000,
"people": ["Richie D", "Reza F", "David P", "Daniel L", "Rick S", "Lisa F"],
"planned_n": 100,
"scanned_n": 0,
"funding": "gates",
"group": "cihm"
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment