/Squished-Circle-Packing

Attempt to improve Circle Packing by expanding the circles until they almost cover the parent circle, optimizing the use of space.

Primary LanguageJavaScript

Squished-Circle-Packing

Circle Packing is a variation of a Treemap that uses circles instead of rectangles, where each branch of the tree is represented as a circle and its sub-branches are represented as circles inside of it. But circle packing layouts have the problem of "wasting" space. In this project I tried to improve this representation by expanding the circles until they almost cover the parent circle. The algorithm uses d3.force on a graph created from a Delaunay triangulation of the circles and employing a custom "triangle" force that tries to set triangle areas to a prescribed value.

You can see the implementation here.