Circle packing, study data

<!DOCTYPE html>
<html>
	<head>
	<meta charset="utf-8" />
	<style>
	text { font: 10px sans-serif; }
	</style>
	</head>
	<body>
		<script src="https://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);

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>

Modified http://d3js.org/d3.v3.min.js to a secure url

https://d3js.org/d3.v3.min.js