Tag-Cloud Drawing: Algorithm for Cloud Visualization
Owen Kaser, Daniel Lemire
Speaker: Yi-Ching Huang
2007/07/17
Introduction
Tag cloud can represent the frequencies of a hundred items
Tag cloud can be generated using– images– browser-specific technologies (ex: ActiveX)– plugins (ex: Flash)– complex HTML (using absolute positioning)– simple HTML with inline text or tables
Problem Definitions
Problems– Wasted space– Large clumps of white space
Solutions– Floorplanning / placement problem (EDA)– Hybrid of text justification (Knuth-Pass
algo) and book-placement (Skiena)
Cloud Layout with Inline Text
1st algo: take an ordered list of tags and choose where to break line– Step 1: Greedy algorithm ,O(n)
• Tags are added to the current line one by one, inserting a white space between them, until the line is full
– Step 2: Dynamic programming ,O(n^2)• Knuth-Plass algorithm• Except that 2 things
– The last line is not an exception– If a tag exceeds the maximal width, then it will be given a
line of its own
Cloud Layout with Inline Text
2nd algo: reorder tags, attempting to decrease the badness– Finding an optimal ordering is NP-hard: when the required
horizontal white space between tags is zero, we have the NP-hard Strip Packing Problem (SPP)
– Dynamic programming to place the tags optimally and keep only the best solution
Next Fit Decreasing Height, Weight heuristic (NFDHW)
Strip Packing Problem
First Fit Decreasing Height (FFDH)Next Fit Decreasing Height (NFDH)
Cloud Layout with Arbitrary Placement Min-cut placement
– Placement approaches in EDA– Recursively decomposes a collection of
tags by bipartitioning: splitting the tags into a “left” group and a “right” group
Slicing Floorplans & Slicing Tree
Slicing floorplans
Slicing tree
Nested Tables for Slicing Floorplans Trick: each internal node in the slicing
tree corresponds to a 2-element table in HTML
Tag Cloud with CSS
Result: Tag Cloud with Inline Text
Result: Tag Cloud with Arbitrary Placement
Conclusion
Use simple HTML with CSS to layout tags
Two approaches for displaying tag cloud– inline text– arbitrary placement