Visualisation: graphs

This practical we'll run through a couple of quick JFreeChart examples, and then look at Processing.

First, we'll make a simple scatterplot in JFreeChart, and then we'll add a regression line to it.

Go to the JFreeChart homepage and download the library (the download link is a tab at the top). Download it from the linked SourceForge site. It comes with the other library you'll need, JCommon, bundled up with it. SourceForge is a popular site for hosting and developing Open Source Software. Download the zipped up versions with the highest version numbers (sometimes the libraries with the highest number are development versions, and a bit buggy - if this is the case, one of the older libraries will indicate it is the last stable release - that's the one you want).

Unzip the files somewhere useful. I usually put these in my src directory, but don't bother putting them in the right hierarchical directories under there -- we'll use Eclipse to link to them.

Open up Eclipse and start a new java project. Link to the two library's jar files. You'll find these in the lib directory you've just unzipped. Generally jar files can be found in this directory for most library distributions. The libraries are jfreechart-1.0.19.jar and jcommon-1.0.23.jar.

We can now start coding.

Make a new blank class with a main that calls its constructor. Add the following to the constructor:

	Frame f1 = new Frame("Scatter");
		
	f1.setSize(600,400);
	f1.addWindowListener(new WindowAdapter() {
		public void windowClosing(WindowEvent we) {
			System.exit(0);
		}
	});

As you can see, we're going to keep it simple and use the AWT frame without extending it. Remember to import the appropriate awt/awt.events packages.

Now we'll add a graph. First add the following code, import the appropriate packages as Eclipse warns you to:

	DefaultXYDataset data = new DefaultXYDataset();

	// Initialise a 2D array - note syntax.
	double dataArray[][] = {{10.0,20.0,30.0,40.0,50.0},{9.0,21.0,32.0,38.0,51.0}}; 
		
	data.addSeries("Points", dataArray);
		
	JFreeChart chart = ChartFactory.createScatterPlot("Age vs. Desperation", 
		"Age", // x axis label
		"Desperation", // y axis label
		data, // data
		PlotOrientation.VERTICAL, // orientation
		true, // legend
		true, // tooltips
		false // URLs
	);
		
	XYPlot plot = (XYPlot) chart.getPlot();
	plot.setBackgroundPaint(Color.lightGray);
	plot.setDomainGridlinePaint(Color.white);
	plot.setDomainGridlinesVisible(true);
	plot.setRangeGridlinePaint(Color.white);
	
	// We're going to add some regression stuff here shortly.
	
	ChartPanel chartPanel = new ChartPanel(chart);	
	f1.add(chartPanel);
	f1.setVisible(true);

Run this to check it works ok. You should see a scattergraph.

Now we'll add a regression line.

There are a wide variety of built in statistical functions in JFreeChart, we you can find in the Docs under the org.jfree.data.statistics package. Here we'll use the Regression.getOLSRegression() method.

Where the code above says "We're going to add some regression stuff here shortly", add the following:

	double[] coeffs = Regression.getOLSRegression(data, 0);
	LineFunction2D linefunction2d = new LineFunction2D(coeffs[0], coeffs[1]);
	XYDataset series2 = DatasetUtilities.sampleFunction2D(linefunction2d, 10, 50, 5, "Linear Regression Line");
	plot.setDataset(2, series2); 

	XYLineAndShapeRenderer lineDrawer = new XYLineAndShapeRenderer(true, false);
	lineDrawer.setSeriesPaint(0, Color.green);
	plot.setRenderer(2, lineDrawer);

Have a careful look at this and compare it with the descriptions in the docs. The sampleFunction2D method is useful - it generates a new point dataset based on a line equation. In this case the line equation is encapsulated in linefunction2d which, in turn, is based on the intersect and gradient coefficients supplied by getOLSRegression. The only problem is, we don't want another point dataset, we want a line, so when we add the new data as the second series (setDataset(2, series2)) we also attach a renderer to it which isn't the default point renderer.

Anyhow, run the code. Hopefully you'll see your original points with a regression line across them.

If you are interested in JFreeChart there's some more examples in the code cookbook, and the docs are useful, however your best source is the developer's guide -- albeit it costs ~40 quid it is worth it, and includes all the source code for the examples on the JFreeChart website.

When you're done with exploring JFreeChart, go on to Part Two where we'll look at Processing.