[HOWTO] create charts with defined data/plot area

[sammen]

Thanks a lot for that post, Paradoxoff! It made a couple of things clearer to me. The patch I use and the example program I am working with are both taken from the patch over at sourceforge (FixedDataAndPlotArea2.diff and FixedDataAreaSizeDemo.java).

Let's say I take FixedDataAreaSizeDemo.java from sourceforge, change the dataarea size to something square(because it's a little bit easier to see what happens), and then try both

Code: Select all

frame.getContentPane().add(chartPanel);

and

Code: Select all

frame.getContentPane().add(scrollPane);

Both cases give the same result: I get square dataareas in all the generated PNGs, but on the screen only the first dataarea is square. The JFrame does not resize as I suppose it should at

Code: Select all

frame.pack();

so starting with the second plot, all plots are squeezed in the JFrame as it was sized at the beginning. I guess this is not the behavior you see?

I use Sun Java 1.6.0_11 on XP SP3.

Just to be extra sure we talk about the same little app, here is the one I use:

Code: Select all

import java.awt.Dimension;
import java.awt.Font;
import java.awt.image.BufferedImage;
import java.awt.Graphics2D;
import java.io.File;
import javax.swing.JFrame;
import javax.swing.JScrollPane;
import org.jfree.chart.ChartFactory;
import org.jfree.chart.ChartPanel;
import org.jfree.chart.JFreeChart;
import org.jfree.chart.ChartUtilities;
import org.jfree.chart.ChartRenderingInfo;
import org.jfree.chart.axis.*;
import org.jfree.chart.plot.PlotOrientation;
import org.jfree.chart.plot.XYPlot;
import org.jfree.chart.title.TextTitle;
import org.jfree.data.xy.DefaultXYDataset;
import org.jfree.ui.RectangleEdge;
import org.jfree.ui.Size2D;

public class Main {
	public static void main(String[] args) {
		double[][] values = new double[][]{{1,2,3,4,5},{10,15,8,37,23}};
		DefaultXYDataset set = new DefaultXYDataset();
		set.addSeries("Values",values);
		BufferedImage image = new BufferedImage(400,800,BufferedImage.TYPE_4BYTE_ABGR);
		Graphics2D g2 = (Graphics2D)image.createGraphics();
		JFreeChart chart = ChartFactory.createScatterPlot(
			"Quadratic Demo","x","y",set,PlotOrientation.HORIZONTAL,true, true, false);
		XYPlot plot = chart.getXYPlot();
		plot.setUseFixedDataAreaSize(true);
		plot.setFixedDataAreaSize(new Size2D(500,500));
		chart.setUseFixedPlotAreaSize(true);

		ChartPanel chartPanel = new ChartPanel(chart,true);
		chartPanel.setUseChartSize(true);
		Size2D chartSize = chart.getPreferredChartAreaSize(g2);
		chartPanel.setPreferredSize(new Dimension((int)chartSize.getWidth(),(int)chartSize.getHeight()));
		chartPanel.setSize(new Dimension((int)chartSize.getWidth(),(int)chartSize.getHeight()));
		JScrollPane scrollPane = new JScrollPane();
		scrollPane.getViewport().setPreferredSize(chartPanel.getPreferredSize());
		scrollPane.setViewportView(chartPanel);

		JFrame frame = new JFrame();
		frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		//frame.getContentPane().add(chartPanel);
        frame.getContentPane().add(scrollPane);
		frame.pack();
		frame.setVisible(true);

		try{
			Thread.sleep(4000);
		}
		catch(InterruptedException e){
		}
		save("small.png",chart);
		System.out.println("Adding axis");
		plot.setDomainAxis(1,new NumberAxis("Second Axis"));
		frame.validate();
		//frame.doLayout();
		frame.pack();
		//frame.setSize(chartPanel.getSize());
		try{
			Thread.sleep(4000);
		}
		catch(InterruptedException e){
		}

		System.out.println("Adding text title");
		TextTitle big = new TextTitle("Long title in a big font",new Font("SansSerif",1,36));
		big.setPosition(RectangleEdge.RIGHT);
		chart.addSubtitle(big);
		frame.validate();
		frame.pack();
		//frame.doLayout();
		save("larger.png",chart);
		try{
			Thread.sleep(4000);
		}
		catch(InterruptedException e){
		}
		System.out.println("Adding 2nd text title");
		TextTitle verybig = new TextTitle("Long title in a very big font",new Font("SansSerif",1,72));
		chart.addSubtitle(verybig);
		verybig.setPosition(RectangleEdge.BOTTOM);
		frame.validate();
		frame.pack();
		//frame.doLayout();
		//frame.setSize(chartPanel.getSize());
		try{
			Thread.sleep(4000);
		}
		catch(InterruptedException e){
		}
		save("even_larger.png",chart);
		System.out.println("Adding 3rd text title");
		TextTitle small = new TextTitle("An even longer title than the first one but with a smaller font",new Font("SansSerif",1,24));
		small.setPosition(RectangleEdge.LEFT);
		chart.addSubtitle(small);
		frame.validate();
		//frame.doLayout();
		frame.pack();
		//frame.setSize(chartPanel.getSize());
		save("largest.png",chart);
	}
	private static void save(String name,JFreeChart chart){
		BufferedImage image = new BufferedImage(400,800,BufferedImage.TYPE_4BYTE_ABGR);
		Graphics2D g2 = image.createGraphics();
		int width = 100;
		int height = 100;
		ChartRenderingInfo info = new ChartRenderingInfo();
		if(chart.getUseFixedPlotAreaSize()){
			width = (int)(chart.getPreferredChartAreaSize(g2).getWidth());
			height = (int)(chart.getPreferredChartAreaSize(g2).getHeight());
		}
		try{
			ChartUtilities.saveChartAsPNG(new File(name),chart,width,height,info);
		}
		catch(Exception e){
			e.printStackTrace();
		}
		System.out.println("Plot area "+ info.getPlotInfo().getPlotArea());
		System.out.println("Data area "+ info.getPlotInfo().getDataArea());

	}

}

[paradoxoff]

Good to see that at least the PNG´s where right!

The patch I use and the example program I am working with are both taken from the patch over at sourceforge (FixedDataAndPlotArea2.diff and FixedDataAreaSizeDemo.java).

Let's say I take FixedDataAreaSizeDemo.java from sourceforge, change the dataarea size to something square(because it's a little bit easier to see what happens), and then try both

Code: Select all

frame.getContentPane().add(chartPanel);

and

Code: Select all

frame.getContentPane().add(scrollPane);

Both cases give the same result: I get square dataareas in all the generated PNGs, but on the screen only the first dataarea is square. The JFrame does not resize as I suppose it should at

Code: Select all

frame.pack();

so starting with the second plot, all plots are squeezed in the JFrame as it was sized at the beginning.

If a JScrollPane is used, the size of the surrounding JFrame will not change. That is expected. If the preferred size of the chart panel changes, only the scroll bars of the JScrollPane will be updated.
If a JFrame is used in which the chart panel is placed, the size of the JFrame should change if the preferred size of the chart panel is changing. That is what you expect, that is what I expected, but none of us seems to get that. Our findings thus seem to be "internally consistent", unfortunately consistently not as expected. I have read various post with similar issues (i.e. custom JComponents or custom JPanels placed in JFrames where the latter refused to change its size if the JComponents/JPanels got a new preferred size), and various weird "solutions". All in all, my impression was that this part of swing does not work as many people expect.
The fact that a JFrame seems to refuse to change its size if the size of the chart panel it its content pane is changing is the reason why I place chart panels in JScrollPanes if I intend to change their size based on a constant data area and based on various axes/titles. Having an automatically resizing JFrame would be a nice addition, but nothing that I am in desperate need of.
FInally: I am a bit concerned about your statement:

Code: Select all

frame.getContentPane().add(chartPanel);

Code: Select all

frame.getContentPane().add(scrollPane);

Both cases give the same result: I get square dataareas in all the generated PNGs, but on the screen only the first dataarea is square

Even if the data area will not be completely visible within the viewport of the scrollpane when the chart gets bigger, I would definitely expect it to be square! If you make the JFrame and thus the included scroll pane bigger, up to the point where the scroll bars disappear, do you still see that the data areas from the second one onwards are not square ?

[sammen]

Thanks again for a very detailed answer. I really appreciate you taking your time to explain things so well.

I have very little time now to test and write, but I can comment on your last question:

Even if the data area will not be completely visible within the viewport of the scrollpane when the chart gets bigger, I would definitely expect it to be square! If you make the JFrame and thus the included scroll pane bigger, up to the point where the scroll bars disappear, do you still see that the data areas from the second one onwards are not square ?

I don't get any scroll bars if I run the code listed below (which is your code with square data area, and scrollPane instead of chartPanel in the frame, no other change). Yesterday when I was playing with this I got the behavior you describe, but I don't remember exactly what I did then.

Later today I'll play more with this.

What I want to end up with is a way to get a default controlled size of the data area, and also to keep the aspect ratio of the axis lengths constant when resizing the frame.

Code: Select all

import java.awt.Container;
import java.awt.Dimension;
import java.awt.Font;
import java.awt.image.BufferedImage;
import java.awt.Graphics2D;
import java.io.File;
import javax.swing.JFrame;
import javax.swing.JScrollPane;
import org.jfree.chart.ChartFactory;
import org.jfree.chart.ChartPanel;
import org.jfree.chart.JFreeChart;
import org.jfree.chart.ChartUtilities;
import org.jfree.chart.ChartRenderingInfo;
import org.jfree.chart.axis.*;
import org.jfree.chart.plot.PlotOrientation;
import org.jfree.chart.plot.XYPlot;
import org.jfree.chart.title.TextTitle;
import org.jfree.data.xy.DefaultXYDataset;
import org.jfree.ui.RectangleEdge;
import org.jfree.ui.Size2D;

public class Main {
public static void main(String[] args) {
		double[][] values = new double[][]{{1,2,3,4,5},{10,15,8,37,23}};
		DefaultXYDataset set = new DefaultXYDataset();
		set.addSeries("Values",values);
		BufferedImage image = new BufferedImage(400,800,BufferedImage.TYPE_4BYTE_ABGR);
		Graphics2D g2 = (Graphics2D)image.createGraphics();
		JFreeChart chart = ChartFactory.createScatterPlot(
			"Quadratic Demo","x","y",set,PlotOrientation.HORIZONTAL,true, true, false);
		XYPlot plot = chart.getXYPlot();
		plot.setUseFixedDataAreaSize(true);
		plot.setFixedDataAreaSize(new Size2D(500,500));
		chart.setUseFixedPlotAreaSize(true);

		ChartPanel chartPanel = new ChartPanel(chart,true);
		chartPanel.setUseChartSize(true);
		Size2D chartSize = chart.getPreferredChartAreaSize(g2);
		chartPanel.setPreferredSize(new Dimension((int)chartSize.getWidth(),(int)chartSize.getHeight()));
		chartPanel.setSize(new Dimension((int)chartSize.getWidth(),(int)chartSize.getHeight()));
		JScrollPane scrollPane = new JScrollPane();
		scrollPane.getViewport().setPreferredSize(chartPanel.getPreferredSize());
		scrollPane.setViewportView(chartPanel);

		JFrame frame = new JFrame();
		frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
		frame.getContentPane().add(scrollPane);
		frame.pack();
		frame.setVisible(true);

		try{
			Thread.sleep(4000);
		}
		catch(InterruptedException e){
		}
		save("small.png",chart);
		System.out.println("Adding axis");
		plot.setDomainAxis(1,new NumberAxis("Second Axis"));
		frame.validate();
		//frame.doLayout();
		frame.pack();
		//frame.setSize(chartPanel.getSize());
		try{
			Thread.sleep(4000);
		}
		catch(InterruptedException e){
		}

		System.out.println("Adding text title");
		TextTitle big = new TextTitle("Long title in a big font",new Font("SansSerif",1,36));
		big.setPosition(RectangleEdge.RIGHT);
		chart.addSubtitle(big);
		frame.validate();
		frame.pack();
		//frame.doLayout();
		save("larger.png",chart);
		try{
			Thread.sleep(4000);
		}
		catch(InterruptedException e){
		}
		System.out.println("Adding 2nd text title");
		TextTitle verybig = new TextTitle("Long title in a very big font",new Font("SansSerif",1,72));
		chart.addSubtitle(verybig);
		verybig.setPosition(RectangleEdge.BOTTOM);
		frame.validate();
		frame.pack();
		//frame.doLayout();
		//frame.setSize(chartPanel.getSize());
		try{
			Thread.sleep(4000);
		}
		catch(InterruptedException e){
		}
		save("even_larger.png",chart);
		System.out.println("Adding 3rd text title");
		TextTitle small = new TextTitle("An even longer title than the first one but with a smaller font",new Font("SansSerif",1,24));
		small.setPosition(RectangleEdge.LEFT);
		chart.addSubtitle(small);
		frame.validate();
		//frame.doLayout();
		frame.pack();
		//frame.setSize(chartPanel.getSize());
		save("largest.png",chart);
	}
	private static void save(String name,JFreeChart chart){
		BufferedImage image = new BufferedImage(400,800,BufferedImage.TYPE_4BYTE_ABGR);
		Graphics2D g2 = image.createGraphics();
		int width = 100;
		int height = 100;
		ChartRenderingInfo info = new ChartRenderingInfo();
		if(chart.getUseFixedPlotAreaSize()){
			width = (int)(chart.getPreferredChartAreaSize(g2).getWidth());
			height = (int)(chart.getPreferredChartAreaSize(g2).getHeight());
		}
		try{
			ChartUtilities.saveChartAsPNG(new File(name),chart,width,height,info);
		}
		catch(Exception e){
			e.printStackTrace();
		}
		System.out.println("Plot area "+ info.getPlotInfo().getPlotArea());
		System.out.println("Data area "+ info.getPlotInfo().getDataArea());

	}

}

EDIT: Scroll bars appear If I decrease the size of the window in the above example, but they don't show up otherwise. The dataarea is not square at the point where the scrollbars just disappear.

[paradoxoff]

I hope that all PNG´s still look as expected,, i.e. have a square data area of the defined size.
If that is the case, then the sizes of the data area, plot and chart are apparently correctly calculated and updated, i.e. most of the patch is working correctly.
The misbehaviour of ChartPanel can have two reasons: either the calculation of its preferred size is broken, or its preferredSize isn´t corretly treated by the container (JScrollPane, JFrame) in which the ChartPanel is placed.
To check that, you could print the preferred size of the chart before the PNG is saved. The size of the image and the preferredSize of the ChartPanel should be identical.
I have done that on my win2K/Java5 machine, and as expected, the sizes were the same.
On my business machine (WinXP, java 1.6.12), I have generated a chart with a fixed data area size and placed that in a JScrollPane. Initially, scroll bars were absent (the size of the viewport of the JScrollPane was set to the preferred size of the JFreeChart), but the appeared as soon as I added axes and titles. The data area maintained its size.
Since you might be seeing a subtle bug, I would really appreciate if you could report the preferred sizes of the ChartPanel to check whether they are ok, i.e. in line with the image sizes.

[sammen]

I hope that all PNG´s still look as expected,, i.e. have a square data area of the defined size.

Yes, they all seem to look good.

Since you might be seeing a subtle bug, I would really appreciate if you could report the preferred sizes of the ChartPanel to check whether they are ok, i.e. in line with the image sizes.

If I do like this for all cases:

Code: Select all

System.out.println("chartPanel.getPreferredSize(): " + chartPanel.getPreferredSize());
save("filename.png",chart);

I get:

• chartPanel.getPreferredSize(): java.awt.Dimension[width=579,height=608]
  Plot area java.awt.geom.Rectangle2D$Double[x=8.0,y=30.140625,w=563.0,h=549.375]
  Data area java.awt.geom.Rectangle2D$Double[x=67.8984375,y=34.140625,w=499.1015625,h=499.9921875]
  Adding axis
  Adding text title
  chartPanel.getPreferredSize(): java.awt.Dimension[width=579,height=608]
  Plot area java.awt.geom.Rectangle2D$Double[x=8.0,y=30.140625,w=613.71875,h=549.375]
  Data area java.awt.geom.Rectangle2D$Double[x=67.8984375,y=34.140625,w=499.7265625,h=499.9921875]
  Adding 2nd text title
  chartPanel.getPreferredSize(): java.awt.Dimension[width=579,height=608]
  Plot area java.awt.geom.Rectangle2D$Double[x=8.0,y=30.140625,w=613.71875,h=549.25]
  Data area java.awt.geom.Rectangle2D$Double[x=67.8984375,y=34.140625,w=499.7265625,h=499.8671875]
  Adding 3rd text title
  chartPanel.getPreferredSize(): java.awt.Dimension[width=579,height=608]
  Plot area java.awt.geom.Rectangle2D$Double[x=70.375,y=30.140625,w=613.34375,h=549.25]
  Data area java.awt.geom.Rectangle2D$Double[x=130.2734375,y=34.140625,w=499.3515625,h=499.8671875]

The first size matches the size of the PNG, the rest don't. Seems like the preferred size calculation is broken. I will try and see if I can find out where.

[paradoxoff]

I just had a brief look at the patch. Apparently the part concerning the ChartPanel is broken. I will try to verify this this evening and fix it.
Sorry for the inconvenience!

[sammen]

Ok. Of course you don't have to excuse anything. I think this is fun, I learn a lot, and I am extremely grateful for any help I can get. Later I hope I will be able to contribute something back to this project.

[paradoxoff]

Patch is uploaded. The major change concerns the paintComponent(...) method of ChartPanel. Here is the correct version of that method:

Code: Select all

    public void paintComponent(Graphics g) {
        super.paintComponent(g);
        if (this.chart == null) {
            return;
        }
        Graphics2D g2 = (Graphics2D) g.create();

        boolean fixedSize = false;
        if(this.chart.getUseFixedChartAreaSize() && useChartSize){
        	fixedSize = true;
	        if(refreshSize){
				Size2D chartSize = chart.getPreferredChartAreaSize(g2);
				int cwidth = (int)(chartSize.getWidth());
				int cheight = (int)(chartSize.getHeight());
				refreshSize = false;
				setPreferredSize(new Dimension(cwidth,cheight));
				invalidate();
	       		revalidate();
		        this.anchor = null;
	    	    this.verticalTraceLine = null;
	        	this.horizontalTraceLine = null;
				repaint();
	        }
        }

        // first determine the size of the chart rendering area...
        Dimension size = fixedSize ? getPreferredSize() : getSize();
        Insets insets = getInsets();
        Rectangle2D available = new Rectangle2D.Double(insets.left, insets.top,
                size.getWidth() - insets.left - insets.right,
                size.getHeight() - insets.top - insets.bottom);

        // work out if scaling is required...
        boolean scale = false;
        double drawWidth = available.getWidth();
        double drawHeight = available.getHeight();
        this.scaleX = 1.0;
        this.scaleY = 1.0;

        if(!fixedSize){
	        if (drawWidth < this.minimumDrawWidth) {
	            this.scaleX = drawWidth / this.minimumDrawWidth;
	            drawWidth = this.minimumDrawWidth;
	            scale = true;
	        }
	        else if (drawWidth > this.maximumDrawWidth) {
	            this.scaleX = drawWidth / this.maximumDrawWidth;
	            drawWidth = this.maximumDrawWidth;
	            scale = true;
	        }
	
	        if (drawHeight < this.minimumDrawHeight) {
	            this.scaleY = drawHeight / this.minimumDrawHeight;
	            drawHeight = this.minimumDrawHeight;
	            scale = true;
	        }
	        else if (drawHeight > this.maximumDrawHeight) {
	            this.scaleY = drawHeight / this.maximumDrawHeight;
	            drawHeight = this.maximumDrawHeight;
	            scale = true;
	        }
        }

        Rectangle2D chartArea = new Rectangle2D.Double(0.0, 0.0, drawWidth,
                drawHeight);

        // are we using the chart buffer?
        if (this.useBuffer) {

            // if buffer is being refreshed, it needs clearing unless it is
            // new - use the following flag to track this...
            boolean clearBuffer = true;

            // do we need to resize the buffer?
            if ((this.chartBuffer == null)
                    || (this.chartBufferWidth != available.getWidth())
                    || (this.chartBufferHeight != available.getHeight())) {
                this.chartBufferWidth = (int) available.getWidth();
                this.chartBufferHeight = (int) available.getHeight();
                GraphicsConfiguration gc = g2.getDeviceConfiguration();
                this.chartBuffer = gc.createCompatibleImage(
                        this.chartBufferWidth, this.chartBufferHeight,
                        Transparency.TRANSLUCENT);
                this.refreshBuffer = true;
                clearBuffer = false;  // buffer is new, no clearing required
            }

            // do we need to redraw the buffer?
            if (this.refreshBuffer) {

                this.refreshBuffer = false; // clear the flag

                Rectangle2D bufferArea = new Rectangle2D.Double(
                        0, 0, this.chartBufferWidth, this.chartBufferHeight);

                Graphics2D bufferG2 = (Graphics2D)
                        this.chartBuffer.getGraphics();
                if (clearBuffer) {
                    bufferG2.clearRect(0, 0, this.chartBufferWidth,
                            this.chartBufferHeight);
                }
                if (scale) {
                    AffineTransform saved = bufferG2.getTransform();
                    AffineTransform st = AffineTransform.getScaleInstance(
                            this.scaleX, this.scaleY);
                    bufferG2.transform(st);
                    this.chart.draw(bufferG2, chartArea, this.anchor,
                            this.info);
                    bufferG2.setTransform(saved);
                }
                else {
                    this.chart.draw(bufferG2, bufferArea, this.anchor,
                            this.info);
                }

            }

            // zap the buffer onto the panel...
            g2.drawImage(this.chartBuffer, insets.left, insets.top, this);

        }

        // or redrawing the chart every time...
        else {

            AffineTransform saved = g2.getTransform();
            g2.translate(insets.left, insets.top);
            if (scale) {
                AffineTransform st = AffineTransform.getScaleInstance(
                        this.scaleX, this.scaleY);
                g2.transform(st);
            }
            this.chart.draw(g2, chartArea, this.anchor, this.info);
            g2.setTransform(saved);

        }

        // Redraw the zoom rectangle (if present)
        drawZoomRectangle(g2);

        g2.dispose();

        this.anchor = null;
        this.verticalTraceLine = null;
        this.horizontalTraceLine = null;

    }

[sammen]

I applied the patch this morning but it was acting the same. Now I just got time to sit down and see if I could find out where things go wrong, and it turned out to be trivial. In the demo app at sourceforge I think a line is missing:

Code: Select all

chart.setUseFixedChartAreaSize(true);

So I never got in to this loop in paintComponent, where the preferred size is set...

Code: Select all

if(this.chart.getUseFixedChartAreaSize() && useChartSize){

I'm really sorry I didn't catch this earlier.

If I put chartPanel directly in the JFrame, the JFrame resizes, however it does not match the chartPanel size. The data area seems to be perfectly square all the time though.

[paradoxoff]

Thanks for reporting this apparent bug in the demo. I will upload a new demo soon where all flags are set so that the desired effect shows up.

[sarsipius]

I don't understand how to patch the code
could you please provide a patched jar of jfreechart-1.0.13?
thanks

[paradoxoff]

I don't understand how to patch the code
could you please provide a patched jar of jfreechart-1.0.13?
thanks

I do not think that it is the purpose of a patch tracker to provide a fully patched jar files. I have uploaded a new patch that contains the source code of the relevant classes (ChartPanel, JFreeChart, Plot, XYPlot, CategoryPlot).

[Jeff in VA]

Peter - I've attempted to download and open your latest zip file (FixedSizes.zip) and WinZip says it is corrupt.

[paradoxoff]

Both 7-zip and IZArc have no problems with the file. Maybe you can try one of the two?

[Jeff in VA]

The latest version of 7-zip can detect the contents of the zip file but won't extract anything - gives message for each file: Unsupported Method