Quick start
A simple example of embedding FoamTree in a HTML page.
Photo explorer
Interactive explorations of photos available on Flickr.
FT500 explorer
Interactive visualization of world's largest companies according to Financial Times.
GitHub search & visualization
Visualization of GitHub search results, makes advanced usage of FoamTree APIs.
Tuning panel
Interactive tweaking of all FoamTree options.
Very large hierarchies
Using FoamTree to browse Tree of Life data, 100k+ groups at 100+ levels.
Deferred layout
Keeping FoamTree responsive while visualizing a large and deep hierarchy.
SCADA system dashboard
Using FoamTree to build a dashboard of readouts from a SCADA system.
FoamTree on touch & mobile
Optimizing FoamTree for touch and mobile devices.
Fancy backdrop image generator
Not often useful but fun to do: generating fancy background images using FoamTree.
Images inside polygons
Drawing custom content, such as SVG images, inside FoamTree polygons.
Rectangular treemaps
Preserving the original order of groups in FoamTree using rectangular layouts.
Interactive custom content
Making custom content interactive. Click the up/down arrows to change group weights.
CSV to FoamTree
A simple conversion of tab-separated CSV data to FoamTree JSON.
Loading indicator
Showing data loading and layout preparation indicator.
Group label editing
A simple utility for interactive editing of FoamTree group labels.
Lazy-loading of visualization data
Fetching child groups only when the user opens the parent group for browsing.
Interaction guide & hints
Enabling FoamTree interaction guide and contextual gesture hints.
Layout relaxation progress
Showing layout relaxation progress bar.
Visualizing unit test code coverage
Showing Java code coverage statistics gathered by Atlassian Clover.
Custom per-group tooltips
Displaying custom HTML-based tooltips with rich information about each group.
Group descriptions
Allocating space for larger group descriptions.
Polygon sizing accuracy
Visualization of how closely polygon areas represent group weights.
FoamTree 2.0.x look and feel
Tuning FoamTree 3.x to look and behave like FoamTre 2.0.x.
Sticky tooltips
Repositioning HTML overlays to match FoamTree zoom, pan and expose transformations.
Graph navigation
Using FoamTree to navigate a graph. Includes a bit more advanced API usage.
FoamTree in scrollable content
Allowing default browser actions for scroll and other events.
Details in title bar
Showing more details about a group in the title bar.