The squarified treemap algorithm keeps each cell near-square by filling rows until adding the next item would worsen the aspect ratio

A treemap represents hierarchical data as nested rectangles where area encodes value. The naive slice-and-dice approach produces thin, hard-to-read strips. The squarified algorithm (Bruls, Huizing, van Wijk 2000) fills a row left-to-right, adding each next item only if doing so keeps the worst aspect ratio closer to square, then starts a new row otherwise. The result is visually compact rectangles that are much easier to compare. The algorithm works recursively: after placing a flat list into rectangles, sub-groups are recursively placed inside each parent rectangle. A common misconception is that squarification is just sort-descending-then-slice — sorting helps aesthetics but the row-filling logic is what controls aspect ratio.

Examples

Treemap.draw(‘div’, 400, 300, [60000, 60000, 40000, 30000], [‘A’,‘B’,‘C’,‘D’]); — largest items land top-left, each near-square. Nested: data = [[60000, 40000], [30000, 10000]] groups items before squarifying within each group.

Assessment

Given data [100, 50, 30, 20, 10], sketch on paper which items would be placed in the first row by the squarified algorithm. Then check with the library.