gaps in StackedXYAreaRenderer2 graph

[dougclayton]

I noticed that when I create an area chart with StackedXYAreaRenderer2, there are vertical lines between each data point when the graph is antialiased. I tracked down the problem, and it is related to the way that edges are composited when they overlap a pixel partially in the awt package. Since this renderer makes two separate vertical slices for each datapoint, it exposes this problem. (For an existing example, check out the second image at http://www.jfree.org/phpBB2/viewtopic.p ... arenderer2).

On sample data, the existing renderer produces the following image:
:

(Notice the six faint vertical white lines.)

After a lot of back-and-forth, I decided the simplest solution was to round the x coordinates (the domain values) to integers so that there is no antialiasing on the vertical edges, and it produces the following image:



These are the changes I made in patch format:

Code: Select all

215c215
<         float transX1 = Math.round((float) domainAxis.valueToJava2D(x1, dataArea, edge0));
---
>         float transX1 = (float) domainAxis.valueToJava2D(x1, dataArea, edge0);
217c217
<             = Math.round((float) domainAxis.valueToJava2D(xleft, dataArea, edge0));
---
>             = (float) domainAxis.valueToJava2D(xleft, dataArea, edge0);
219c219
<             = Math.round((float) domainAxis.valueToJava2D(xright, dataArea, edge0));
---
>             = (float) domainAxis.valueToJava2D(xright, dataArea, edge0);

Note that this problem should also manifest itself on the horizontal edges between stacked areas as well, but since those aren't usually straight lines it's not as apparent.

I posted this here because I spent a lot of time trying to figure this out, and couldn't find any answers on this forum. Hopefully this will help other people looking for the reason lines show up in their graph.

[dougclayton]

By the way, I wrote the following code to generate those images:

Code: Select all

import java.io.File;
import java.io.IOException;
import java.util.Date;

import org.jfree.chart.ChartUtilities;
import org.jfree.chart.JFreeChart;
import org.jfree.chart.axis.DateAxis;
import org.jfree.chart.axis.NumberAxis;
import org.jfree.chart.plot.XYPlot;
import org.jfree.chart.renderer.xy.XYItemRenderer;
import org.jfree.data.time.Day;
import org.jfree.data.time.TimeTableXYDataset;

/**
 * Shows that org.jfree.chart.renderer.xy.StackedXYAreaRenderer2 leaves
 * vertical gaps when antialiasing is on. 
 */
public class AreaRendererBugDemo
{

	public static void main(String[] args)
	throws IOException
	{		
		TimeTableXYDataset dataset = new TimeTableXYDataset();

		// add some data
		long t = 0;
		int [] points = { 1, 10, 1, -1, -10, -1 };
		for (int n = 0; n < points.length; n++)
		{
			dataset.add(new Day(new Date(t)), points[n], "category");
			t += 86400000L;
		}
		
		// first create a chart with the gaps
		createChart(dataset, new org.jfree.chart.renderer.xy.StackedXYAreaRenderer2(), "gaps.png");
		
		// now render a chart without the gaps
		createChart(dataset, new test.StackedXYAreaRenderer2(), "gaps_removed.png");
	}
	
	private static void createChart(TimeTableXYDataset dataset, XYItemRenderer renderer, String filename) 
	throws IOException
	{
		XYPlot plot = new XYPlot(dataset, new DateAxis(null), new NumberAxis(null), renderer);

		JFreeChart chart = new JFreeChart(plot);
		chart.setAntiAlias(true);
		chart.removeLegend();
		chart.setTitle((String)null);
		ChartUtilities.saveChartAsPNG(new File(filename), chart, 600, 300);
	}
}

[mwbalk]

This problem still persists in JFreeChart 1.0.2. I gave your solution a try and it works just fine. Thanks for the posting.

[david.gilbert]

I tried this also, and it works well in most cases. It seems to revert to the old behaviour when the ChartPanel scaling kicks in (small or large panel sizes). The other reservation I have about this is that the rounding will cause a loss of precision for high resolution (or resolution independent) output formats like SVG and PDF. For this reason, I'm looking at implementing this with a flag to allow it to be turned on or off.

[vani_hegde]

Is there a new version that turns off these lines? Or any other solution?

[dougbclayton]

David, thanks for your reply. Yes, it probably will cause the old problem when the panel is scaled because then the values that were once rounded to integer coordinates will no longer be integral. As for device-independent drawing, I agree that my solution above is definitely a hack. I don't know how to solve it properly without rewriting the class not to use separate vertical slices to draw the areas, but that change was definitely outside my time constraints. (I tried the other stacked-area class, but it never seemed to draw properly at all.)

Since in general I don't think there is a way to know whether the output is going to be rasterized and what that resolution will be, a flag is probably called for.

[david.gilbert]

For 1.0.3, I added a roundXCoordinates flag to the StackedXYAreaRenderer2 class, but must have gotten distracted and never added the accessor methods to set the flag. These have been committed to CVS for the 1.0.4 release.

[jattra]

Hello, I am experiencing same problems (vertical lines). The workaround with rounding coords does not work for me. This may be because I need to use time domain axis.

I have figured out that the original StackedXYAreaRenderer does not have the described defect. However the original StackedXYAreaRenderer works only for two data series at max. I have more series and the graph result is wierd.

Is there hope that either the original StackedXYAreaRenderer or the new StackedXYAreaRenderer2 will be fixed?

I am using JFreeChart 1.0.13

Thank You.

[conwaypm]

Hi. I am using the StackedXYAreaRenderer2 with the round flag set as true. I am however still getting thin white vertical lines in PNG output of the chart. I am using a DateAxis for the domain axis and a NumberAxis for the range axis. Does anyone know why I might still be getting these vertical lines despite having the flag set to true?