The Column Chart Bean
This bean will generate a Column chart bean based upon the data contained within several data objects. We have split the information required, to produce the chart image, into the following objects,
Each of these objects is a property of the Column Chart Bean and as such, once the object is created your application can simply set the relevant property within the bean.
Set and Get method summary,
Legend Properties Object Get and Set methods
getLegenddata()
setLegenddata(Legenddata object)Chart Properties Object Get and Set methods
getChartdata()
setChartdata(Chartdata object)Image Object Get and Set methods
getImagedata()
setImagedata(Imagedata object)Text Object Get and Set methods
getTextdata()
setTextdata(Textdata object)Title Object Get and Set methods
getTitledata()
setTitledata(Titledata object)X Labels Object Get and Set methods
getXlabelsdata()
setXlabelsdata(Xlabelsdata object)Y Labels Object Get and Set methods
getYlabelsdata()
setYlabelsdata(Ylabelsdata object)Series data Object Get and Set methods
getSeriesdata()
setSeriesdata(Seriesdata object)Min Max Object Get and Set methods
getMinmaxdata()
setMinmaxdata(Minmaxdata object)
Below we describe each of the objects in detail and explain their role within the chart bean. You will see in the applet and application examples that using the column chart bean is simple and straight forward. With all the data required being contained within the data objects, the process is simply one of creating an instance of the columnchart bean, creating the data objects and finally setting the object properties of the bean.
1. The Chart Data Object
This object contains all the general information which define the following characteristics of the chart.
Three D | Boolean flag indicating whether the chart should be drawn in 3D or 2D mode. |
Grid | Boolean flag indicating whether the chart should be drawn with a grid or not. |
Axis | Boolean flag indicating whether the chart should be drawn with axis or not. |
Y Labels | Boolean flag indicating whether the Y axis labels should be automatically generated or not |
Outline | Boolean flag indicating whether the columns should be emphasised with an outline, only relevant in 3D mode. |
Legend | Boolean flag indicating whether the legend should be automatically generated from the series data. |
Width | The width of the image to be produced |
Height | The height of the image to be produced |
Number of Columns | Max number of data columns within each series |
Number of Rows | Number of horizontal rows |
Vertical Spacing | Vertical spacing of the rows in pixels |
Horizontal Spacing | Horizontal spacing in pixels between the data points |
Grid X position | Left position of the grid |
Grid Y position | Bottom position of the grid |
Depth 3D | The depth in pixels of the 3D effect |
N Decimal Places | The number of the decimal places to use when displaying values |
Column Width | The width of the columns in pixels |
Chart Scale | The value that each vertical interval represents |
Chart Start Y Value | The value that the chart base line should represent |
Grid Color | The color of the Grid |
Axis Color | The color of the axis |
Floor Color | The x-axis floor color in 3D mode |
Label Color | Text color of the labels |
Background Color | Background color |
Background Color | Background color |
Outline Color | Column Outline Color |
Example code to create the Chart data object and then add this into an instance of the column chart bean called columnchart.
private Vector chartdata;
chartdata = new Vector();
chartdata.addElement(new Chartdata(true, // threeD true, // grid true, // axis true, // ylabels false, // outline true, // legend 600, // width 320, // height 12, // number of columns, 7, // number of nrows, 20, // vertical spacing, 3, // number of series, 30, // horizontal spacing, 95, // gridxpos, 200, // gridypos, 15, // depth3D, 2, // ndecplaces, 10, // Column width 1000, // chartScale, 5000, // chartStartY, new Color(100,100,100), // gridColor, new Color(0,0,0), // axisColor, new Color(100,100,100), // floorColor, new Color(0,0,0), // labelColor, new Color(255,255,231), // backgroundColor new Color(200,200,200) // column outline color ));
columnchart.setChartdata(chartdata);
2. Legend Data Object
This object provides the chart bean with the necessary information with which to produce the automatic legend for the chart. The properties are,
Title | The legend title text |
Color | Text color |
Font | Text Font |
Position | Top left position of the legend area |
Example code to create the Legend data object and then add this into an instance of the column chart bean called columnchart.
private Vector legenddata; legenddata = new Vector();
legenddata.addElement(new Legenddata("Products", // Legend title new Color(0,0,0), // Legend text color new Font("Courier",Font.PLAIN,12), // Legend text font new Point(475,100) // Legend top-left position (x,y) ));
columnchart.setLegenddata(legenddata);
3. Title data object
The title data object contains one element for each title that is displayed upon the chart. e.g Main Title, X-axis title and Y-axis title. Each title element is made up of the following properties,
Text | Title Text |
Color | Text Color |
Font | Text Font |
Position | Tile position |
The following example code demonstrates how to construct a Title Data object ( titledata) which contains three elements representing A Main Title, The X-axis title and The Y-axis title.
private Vector titledata; titledata = new Vector();
titledata.addElement(new Titledata("Sales",new Color(0,0,0),
new Font("TimesRoman",Font.BOLD + Font.ITALIC,24),
new Point(100,20)));
titledata.addElement(new Titledata("Fiscal Period",new Color(0,0,0),
new Font("TimesRoman",Font.BOLD,14),
new Point(220,260)));
titledata.addElement(new Titledata("Value in £",new Color(0,0,0), new Font("TimesRoman",Font.BOLD,14),
new Point(10,225)));
columnchart.setTitledata(titledata);
4. Xlabels data object
The Xlabels data object defines each of the labels along the x-axis of the chart. Each element in this object defines the following characteristics,
Text | Label Text |
Color | Text Color |
Font | Text Font |
Y-position | Y position for this label |
Orientation | The label orientation ( 0 to 6 ) |
In this example we have twelve labels representing each month of the year,
private Vector xlabelsdata; xlabelsdata = new Vector();
xlabelsdata.addElement(new Xlabelsdata("Jan",new Color(0,0,0),new Font("Courier",Font.PLAIN,12), 220, 0)); xlabelsdata.addElement(new Xlabelsdata("Feb",new Color(0,0,0),new Font("Courier",Font.PLAIN,12), 220, 0));
xlabelsdata.addElement(new Xlabelsdata("Mar",new Color(0,0,0),new Font("Courier",Font.PLAIN,12), 220, 0));
xlabelsdata.addElement(new Xlabelsdata("Apr",new Color(0,0,0),new Font("Courier",Font.PLAIN,12), 220, 0));
xlabelsdata.addElement(new Xlabelsdata("May",new Color(0,0,0),new Font("Courier",Font.PLAIN,12), 220, 0));
xlabelsdata.addElement(new Xlabelsdata("Jun",new Color(0,0,0),new Font("Courier",Font.PLAIN,12), 220, 0));
xlabelsdata.addElement(new Xlabelsdata("Jul",new Color(0,0,0),new Font("Courier",Font.PLAIN,12), 220, 0));
xlabelsdata.addElement(new Xlabelsdata("Aug",new Color(0,0,0),new Font("Courier",Font.PLAIN,12), 220, 0));
xlabelsdata.addElement(new Xlabelsdata("Sept",new Color(0,0,0),new Font("Courier",Font.PLAIN,12), 220, 0));
xlabelsdata.addElement(new Xlabelsdata("Oct",new Color(0,0,0),new Font("Courier",Font.PLAIN,12), 220, 0));
xlabelsdata.addElement(new Xlabelsdata("Nov",new Color(0,0,0),new Font("Courier",Font.PLAIN,12), 220, 0));
xlabelsdata.addElement(new Xlabelsdata("Dec",new Color(0,0,0),new Font("Courier",Font.PLAIN,12), 220, 0));
columnchart.setXlabelsdata(xlabelsdata);
5. Ylabels data object
This object defines just two characteristics of the Y-labels of the chart.
Color | Y - Labels Color |
Font | Y - Label Font |
private Vector ylabelsdata; ylabelsdata = new Vector(); ylabelsdata.addElement(new Ylabelsdata(new Color(0,0,0),new Font("Courier",Font.PLAIN,10))); columnchart.setYlabelsdata(ylabelsdata);
6. Series and Column data object
This object is actually two objects which hold the information about all the data point to be plotted. The series data object contains information which applies to all columns within a series and contains a column data object. The column data object contains one element for each column in the series.
Series Data Object
Series Name | Series name text used in the legend |
Column Color | Color of the Columns to be plotted |
Column data object | see below |
Column Data object
value | value of this column |
display value flag | boolean flag to indicate whether this value should be displayed |
The following code demonstrates how to create the objects that are required to represent 3 series of data each with upto 12 data columnss. Note series 2 only contains 6 columns and therefore the plot for this series would cease there.
private Vector seriesdata;
private Vector columndata;
seriesdata = new Vector();
// Series 1 columndata = new Vector(); columndata.addElement(new Columndata(5100, false)); columndata.addElement(new Columndata(5500, false)); columndata.addElement(new Columndata(6400, false)); columndata.addElement(new Columndata(8200, false)); columndata.addElement(new Columndata(8900, false)); columndata.addElement(new Columndata(9300, false)); columndata.addElement(new Columndata(7000, false)); columndata.addElement(new Columndata(6300, false)); columndata.addElement(new Columndata(7000, false)); columndata.addElement(new Columndata(7400, false)); columndata.addElement(new Columndata(8100, false)); columndata.addElement(new Columndata(11000, false)); seriesdata.addElement(new Seriesdata("Product X", new Color(255,50,50), columndata));
// Series 2 columndata = new Vector(); columndata.addElement(new Columndata(8300, false)); columndata.addElement(new Columndata(7100, false)); columndata.addElement(new Columndata(6550, false)); columndata.addElement(new Columndata(5300, false)); columndata.addElement(new Columndata(5200, false)); columndata.addElement(new Columndata(5050, false)); seriesdata.addElement(new Seriesdata("Product Y", new Color(255,100,255), columndata));
// Series 3 columndata = new Vector(); columndata.addElement(new Columndata(5700, false)); columndata.addElement(new Columndata(5150, false)); columndata.addElement(new Columndata(5050, false)); columndata.addElement(new Columndata(5150, false)); columndata.addElement(new Columndata(5300, false)); columndata.addElement(new Columndata(5700, false)); columndata.addElement(new Columndata(6500, false)); columndata.addElement(new Columndata(7100, false)); columndata.addElement(new Columndata(7700, false)); columndata.addElement(new Columndata(8400, false)); columndata.addElement(new Columndata(8200, false)); columndata.addElement(new Columndata(8600, false)); seriesdata.addElement(new Seriesdata("Product Z", new Color(50,255,50), columndata));
columnchart.setSeriesdata(seriesdata);
7. Min / Max data object
This object provides the facility for adding limit lines running across the chart (e.g. average level, Min Max levels, Target levels ). The properties for this object are,
Name | Text for the limit line |
Color | Color of the limit line |
Font | Font for the text |
Value | Value at which the line to be plotted |
Style | The style ranging from 0 to 3 |
The following code defines two limit lines representing Break Even and Target lines on a Sales chart.
private Vector minmaxdata; minmaxdata = new Vector(); minmaxdata.addElement(new MinMaxdata("Break Even",new Color(100,0,0), new Font("Arial",Font.BOLD,12),6300,0)); minmaxdata.addElement(new MinMaxdata("Target",new Color(0,100,0), new Font("Arial",Font.BOLD,12),8700,1)); columnchart.setMinmaxdata(minmaxdata);
8. Image data object
This object provides the facility for adding bespoke images to the chart area. For example you may wish to incorporate a company logo or product image. The properties for this object are,
Image file name | The image filename |
Image | The image object |
Position | The position on the chart to draw this image |
The following code demonstrates how to create the image data object for three images, meter1.gif, tools1.gif and drill1.gif. (Note : downloadImage(); is a bespoke function for loading an image file into a java image object)
private Vector imagedata; imagedata = new Vector(); imagedata.addElement(new Imagedata("meter1.gif", downloadImage("meter1.gif"), new Point(570,100))); imagedata.addElement(new Imagedata("tools1.gif", downloadImage("tools1.gif"), new Point(570,118))); imagedata.addElement(new Imagedata("drill.gif", downloadImage("drill1.gif"), new Point(570,136))); columnchart.setImagedata(imagedata);
9. Text data object
The final object provides the facility for adding bespoke lines of text onto the chart image. This can be used for additional descriptions or notes on the chart area. The properties of each text element are,
Text | The text to be displayed |
Color | Text Color |
Font | Text Font |
Position | Position of the text |
The following example code creates a Textdata object with three elements ( line of text ),
private Vector textdata; textdata = new Vector(); textdata.addElement(new Textdata("Notes:", // Text line 1 new Color(100,0,0), // text color new Font("Courier",Font.BOLD,12), // text font new Point(345,260) // text position (x,y) )); textdata.addElement(new Textdata("Product Y was discontinued", // Text line 2 new Color(0,0,0), // text color new Font("Courier",Font.PLAIN,12), // text font new Point(350,272) // text position (x,y) )); textdata.addElement(new Textdata("in June 2000.", // Text line 3 new Color(0,0,0), // text color new Font("Courier",Font.PLAIN,12), // text font new Point(350,284) // text position (x,y) )); columnchart.setTextdata(textdata);
There are no further properties of this bean. It is recommended that,
to fully appreciate how to incorporate this bean into your own applications,
that you spend some time looking at the applet and application examples.