A Flex component for graph visualization
Friday, November 17th, 2006I’d like to introduce a Adobe Flex component I’ve been working on. The component displays a graph of objects that are linked to each other, using a force-directed layout algorithm. My SpringGraph page presents some examples, the documentation, and a download. Go take a look.
This component is the result of an ongoing experiment in exploring the information of the internet as a set of interconnected data. This is not the same as web browsing, which focuses on websites and pages of data. This is web “roaming” - exploring data by the connections from one piece of information to another. This is exemplified by the Amazon roamer, with which you can roam the Amazon product database by following the “similar products” links between products. When you play with it a little bit, you’ll notice how the data groups itself into clusters, and how sometimes only a few links can take you to a very different product area.
There are actually 2 Flex components in the download. SpringGraph is the main component - you give it a graph of items and links, and specify the Flex UI for displaying each item. The graph can be given as XML, or built from the Graph class. The UI can range from as a single MXML tag, all the way to a complex component. The component follows the dataProvider/itemRenderer pattern seen in other Flex components such as DataGrid or List, with one difference - the dataProvider is a graph rather than an array.
The other component is called Roamer. It is a subclass of SpringGraph, and adds the abilty to filter the view to a small neighborhood around the ‘current’ item. This makes it possible to load in a huge graph and then view it a little bit at a time. The Roamer Demo shows a couple of examples, one with 12,000 items and one with 26,000.
This component is also available for download from the . Thanks to everyone who has already downloaded it, I hope it’s working OK for you. I’ve made several updates to the component, so make sure you have the latest version. And special thanks to the 5 generous people who gave SpringGraph a 5/5 rating!