| <!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