The documentation available for prefuse is quite sparse, it consists mainly of the JavaDoc API documentation and demo source code. Even though the demo source code provides as good starting point (cp. [Heer et al., 1995] ), in my opinion the examples are overly complex for beginners.

Therefore, this tutorial starts with the minimum source code to create a scatter plot and incrementally adds features. Further, it discusses an axis-based visualization technique, whereas the documentation of prefuse focuses on graph visualization.

Here we create the outline of our demo application. It is designed very simple and consists of four static methods:

• private static Table generateTable()
  • prepare a prefuse data table with some hard coded values (see below)
• private static JComponent createVisualization(Table data)
  • now this is only some dummy code, but in the following phases our prefuse code will be inserted here.
• private static void createAndShowGUI(JComponent display)
  • some basic Swing code to set up a window for the demo application
• public static void main(String[] args)
  • runs these three methods

This shows, how we create a data table for our tutorial. We use hard coded values so that the demo application stays self-contained. It would be easy to replace this method by a call to prefuse's DelimitedTextTableReader.

	private static Table generateTable() {
		Table table = new Table();
 
		// use a calendar for input of human-readable dates  
		GregorianCalendar cal = new GregorianCalendar();
 
		// set up table schema
		table.addColumn("Date", Date.class);
		table.addColumn("BMI", double.class);
		table.addColumn("NBZ", int.class);
		table.addColumn("Insult", String.class);
 
		table.addRows(3);
 
		cal.set(2007, 11, 23);
		table.set(0, 0, cal.getTime());
		table.set(0, 1, 21.0);
		table.set(0, 2, 236);
		table.set(0, 3, "F");
 
		cal.set(2008, 6, 22);
		table.set(1, 0, cal.getTime());
		table.set(1, 1, 35.8);
		table.set(1, 2, 400);
		table.set(1, 3, "F");
 
		cal.set(2009, 3, 8);
		table.set(2, 0, cal.getTime());
		table.set(2, 1, 28.8);
		table.set(2, 2, 309);
		table.set(2, 3, "T");
 
		return table;
	}

Source Code

Next, we extend the method createVisualization(Table) and add the minimal source code to show a scatter plot.

First, we need to create instances of Visualization and Display and link these with each other and the data table.

		Visualization vis = new Visualization();
		Display display = new Display(vis);
		vis.add("data", data);

Second, we create a AxisLayout for the x axis and another one for the y axis. When these layouts are run, they will set the x and coordinate of all visual items.

		AxisLayout x_axis = new AxisLayout("data", "NBZ", Constants.X_AXIS,
				VisiblePredicate.TRUE);
 
		AxisLayout y_axis = new AxisLayout("data", "BMI", Constants.Y_AXIS,
				VisiblePredicate.TRUE);

Third, a ColorAction will set the color of all visual items to blue.

		ColorAction color = new ColorAction("data", VisualItem.STROKECOLOR,
				ColorLib.rgb(100, 100, 255));

Fourth, these actions are combined to an ActionList and linked to the Visualization.

		ActionList draw = new ActionList();
		draw.add(x_axis);
		draw.add(y_axis);
		draw.add(color);
		vis.putAction("draw", draw);

Finally, we run this ActionList and return the Display so that it can be shown in the window.

		vis.run("draw");
 
		return display;

This is the resulting visualization: