Enclosure diagrams use containment to represent the hierarchy. Although circle packing is not as space-efficient as a treemap, it better reveals the hierarchy. Implementation based on work by Jeff Heer. Data shows the Flare class hierarchy, also courtesy Jeff Heer.
A fork and port of mike's js version (gist/block), programmed in clojurescript atop the maturing strokes library.
This is running atop the first version of strokes that is able to repair a persistent data structure that has been mutated by javascript as the d3 layouts do - effectively trying to add new fields to the clojure maps. In this example the mrhyde function repersist
reconstructs a persistent view of each node.
(Merge request? Use the repo version.)
xxxxxxxxxx
<meta charset="utf-8">
<title>Circle-pack</title>
<style>
circle {
fill: rgb(31, 119, 180);
fill-opacity: .25;
stroke: rgb(31, 119, 180);
stroke-width: 1px;
}
.leaf circle {
fill: #ff7f0e;
fill-opacity: 1;
}
text {
font: 10px sans-serif;
}
</style>
<body>
<script type="text/javascript" src="https://d3js.org/d3.v3.min.js"></script>
<script type="text/javascript" src="strokes-circle-pack.js"></script>
Modified http://d3js.org/d3.v3.min.js to a secure url
https://d3js.org/d3.v3.min.js