Line Graph Configuration Options
Whichever method ( file, html code, server process etc.) you choose to supply the graph with the configuration options the various parameters all follow the same format of
[Parameter Name] , [Parameter Value].
Below you will find each option detailed with examples for supplying by file and html code.
Please Note : Parameters Names are case sensitive. ( i.e.. axis is not the same as Axis ).
Graph Switches ( Boolean flags )
Parameter Name : 3D
Description : Specifies whether the graph should be drawn in 2D or 3D.
Range of Values : true or false
File Example : 3D true
Html Code Example : <PARAM name="3D" value="true">
Parameter Name : grid
Description : Specifies whether the graph grid should be drawn.
Range of Values : true or false
File Example : grid true
Html Code Example : <PARAM name="grid" value="true">
Parameter Name : axis
Description : Specifies whether the graph axis should be drawn.
Range of Values : true or false
File Example : axis true
Html Code Example : <PARAM name="axis" value="true">
Parameter Name : ylabels
Description : Specifies whether the y-axis labels should be drawn.
Range of Values : true or false
File Example : ylabels true
Html Code Example : <PARAM name="ylabels" value="true">
Parameter Name : legend
Description : Specifies whether the legend should be automatically generated.
Range of Values : true or false
File Example : legend true
Html Code Example : <PARAM name="legend" value="true">
Graph Characteristics ( Integer Values )
Parameter Name : width
Description: Specified the width of the Graph Image to be produced. This parameter
only applies to the Servlet form, the Applet form takes the width parameter
from the <APPLET> tag.
Range of Values : Integer
Value
File Example : width 500
Parameter Name : height
Description: Specified the height of the Graph Image to be produced. This parameter
only applies to the Servlet form, the Applet form takes the height parameter
from the <APPLET> tag.
Range of Values : Integer
Value
File Example : height 420
Parameter Name : nPoints
Description : Defines the maximum number of points per series (e.g.. If you
have 3 series each with upto 12 pieces of data then this should be set to 12).
Range of Values : Integer Value
File Example : nPoints 12
Html Code Example : <PARAM name="nPoints"
value="12">
Parameter Name : nRows
Description : Defines the number of rows for this graph grid
Range of Values : Integer Value
File Example : nRows 7
Html Code Example : <PARAM name="nRows" value="7">
Parameter Name : vSpace
Description : Defines the number of pixel for each row.
Range of Values : Integer Value
File Example : vSpace 30
Html Code Example : <PARAM name="vSpace" value="30">
Parameter Name : nSeries
Description : Defines the number of series of data for this graph (e.g.. If you have 3 series each with 12 pieces of data then this should be set to 2).
Range of Values : Integer Value
File Example : nSeries 2
Html Code Example : <PARAM name="nCols" value="3">
Parameter Name : hSpace
Description : Defines the horizontal interval in pixels between data points.
Range of Values : Integer Value
File Example : hSpace 30
Html Code Example : <PARAM name="hSpace" value="30">
Parameter Name : gridxpos
Description : Defines the starting x position for the graph grid relative to the left edge of the image.
Range of Values : Integer Value
File Example : gridxpos 75
Html Code Example : <PARAM name="gridxpos" value="75">
Parameter Name :gridypos
Description : Defines the starting y position for the graph grid relative to the top edge of the image.
Range of Values : Integer Value
File Example : gridypos 350
Html Code Example : <PARAM name="gridypos" value="350">
Parameter Name :gridystyle
Description : Defines the line style for the grid lines.
Range of Values : Integer Value where,
File Example : gridstyle 3
Html Code Example : <PARAM name="gridstyle" value="3">
Parameter Name : depth3D
Description : Defines the depth of the 3D effect .
Range of Values : Integer Value
File Example : depth3D 15
Html Code Example : <PARAM name="depth3D" value="15">
Parameter Name : ndecplaces
Description : Defines the number of decimal places to use when displaying values.
Range of Values : Integer Value
File Example : ndecplaces 3
Html Code Example : <PARAM name="ndecplaces" value="3">
Parameter Name : labelOrientation
Description : Defines the orientation of the x-axis labels.
Range of Values : Integer Value 0 to 3 where
File Example : labelOrientation 0
Html Code Example : <PARAM name="labelOrientation" value="0">
Parameter Name : labelsY
Description : Y position of the x-axis labels.
Range of Values : Integer Value
File Example : labelsY 375
Html Code Example : <PARAM name="labelsY" value="375">
Graph Characteristics ( Double Precision, Real, Decimal Values )
Parameter Name : chartScale
Description : Defines the value each row represents .
Range of Values : Decimal Value
File Example : chartScale 30.0
Html Code Example : <PARAM name="chartScale" value="30.0">
Parameter Name : chartStartY
Description : Defines the starting value for the graph (i.e. the value the x-axis represents) .
Range of Values : Decimal Value
File Example : chartStartY 0.0
Html Code Example : <PARAM name="chartStartY" value="0.0">
Series Characteristics
For each series of data, five characteristics can be defined, Line Color, Point Style, Point Size, Fill, and Legend text. These are supplied via the "seriesN" (where N is an integer ranging from 1 to the total number of series) parameter separated by a | character.
Range of Values : Color definition |Integer between 1 & 7|Integer|true or false|Legend Text.
(Click here for More on Defining colors)
For the Point style the following symbols are represented,
Each of the symbols can be outline or solid by setting the fill element to false or true.
For example if we have 3 series of the data,
File Example :
series1 200,0,0|6|16|false|Series 1
series2 200,0,200|6|16|true|Series 2
series3 0,200,0|0|10|false|Series 3
Html Code Example :
<PARAM name="series1" value="200,0,0|6|16|false|Series 1">
<PARAM name="series2" value="200,0,200|6|16|true|Series 2">
<PARAM name="series3" value="0,200,0|0|10|false|Series 3">
Labels
The x-axis labels are supplied by the labelN parameter, where N represents an integer number starting with 1. The label parameter can be made up of two elements, Label Text | Label Y offset. The label offset is an integer number which specifies the number of pixels to offset the label. This is useful where you wish to stagger alternate labels. For example if you have 3 series each four 4 pieces of data (i.e. 4 points in each series) then 4 labels should be supplied e.g.,
File Example :
label1 Quarter 1|15
label2 Quarter 2
label3 Quarter 3|15
label4 Quarter 4Html Code Example :
<PARAM name="label1" value="Quarter 1|15">
<PARAM name="label2" value="Quarter 2">
<PARAM name="label3" value="Quarter 3|15">
<PARAM name="label4" value="Quarter 4">
Font Information
Most of the font information is incorporated into other parameters (see Titles below) however the following two fonts are defined as follows,
Parameter Name : font14
Description : Defines the font for the Y axis labels.
Range of Values : Font Definition (click here for More on Defining fonts) .
File Example : font14 TimesRoman,I,10
Html Code Example : <PARAM name="font14" value="TimesRoman,I,10">
Parameter Name : font15
Description : Defines the font for the X axis labels.
Range of Values : Font Definition (click here for More on Defining fonts) .
File Example : font15 TimesRoman,I,10
Html Code Example : <PARAM name="font15" value="TimesRoman,N,10">
Color Information
Most of the color information is incorporated into other parameters (see Titles below) however the following six colors are defined as follows,
Parameter Name : BackgroundColor
Description : Defines the background color for the graph image. This parameter
only applies to the servlet version. The Applet uses the Start-Up background
color parameter with the html.
Range of Values : Color Definition (click here for More
on Defining colors) .
File Example : BackgroundColor 255,255,255
Parameter Name : color14
Description : Defines the grid color.
Range of Values : Color Definition (click here for More
on Defining colors) .
File Example : color14 100,100,100
Html Code Example : <PARAM name="color14"
value="0,0,0">
Parameter Name : color15
Description : Defines the axis color.
Range of Values : Color Definition (click here for More on Defining colors) .
File Example : color15 0,0,0
Html Code Example : <PARAM name="color15" value="0,0,0">
Parameter Name : color16
Description : Defines the floor color of the x axis in 3D mode.
Range of Values : Color Definition (click here for More on Defining colors) .
File Example : color16 0,100,100
Html Code Example : <PARAM name="color16" value="0,100,100">
Parameter Name : color17
Description : Defines the outline color.
Range of Values : Color Definition (click here for More on Defining colors) .
File Example : color17 0,0,0
Html Code Example : <PARAM name="color17" value="0,0,0">
Parameter Name : color18
Description : Defines the x axis label text color.
Range of Values : Color Definition (click here for More on Defining colors) .
File Example : color18 0,0,0
Html Code Example : <PARAM name="color18" value="0,0,0">
Parameter Name : color19
Description : Defines the Y axis label text color.
Range of Values : Color Definition (click here for More on Defining colors) .
File Example : color19 0,0,0
Html Code Example : <PARAM name="color19" value="0,0,0">
Automatic Legend
The following set of parameters define the characteristics of the automatic legend,
Parameter Name : legendfont
Description : Defines the font for the legend.
Range of Values : Font Definition (click here for More on Defining fonts) .
File Example : legendfont Arial,N,10
Html Code Example : <PARAM name="legendfont" value="Arial,N,10">
Parameter Name : legendposition
Description : Defines the x,y position of the top left of the legend.
Range of Values : integer number (X value), integer number (Y value) .
File Example : legendposition 200,5
Html Code Example : <PARAM name="legendposition" value="200,5">
Parameter Name : legendtitle
Description : The text for legend title.
Range of Values : text .
File Example : legendtitle Product Sales
Html Code Example : <PARAM name="legendtitle" value="Product Sales">
Parameter Name : legendBackground
Description : Legend background color
Range of Values : Color Definition (click here for More on Defining colors).
File Example : legendBackground 200,200,200
Html Code Example : <PARAM name="legendBackground" value="200,200,200">
Parameter Name : legendBorder
Description : Legend border color
Range of Values : Color Definition (click here for More on Defining colors).
File Example : legendBorder 125,125,125
Html Code Example : <PARAM name="legendBorder" value="125,125,125">
Parameter Name : legendtextColor
Description : Legend text color
Range of Values : Color Definition (click here for More on Defining colors).
File Example : legendtextColor 0,0,0
Html Code Example : <PARAM name="legendtextColor" value="0,0,0">
Graph Titles
Parameter Name : title
Description : Defines the main title for the graph. This parameter is made up of four elements each separated by a | character. The four elements represent, Title Text, Title Position, Font and Text Color.
Range of Values : Text | Position | Font definition | Color definition.
File Example : title Sales by Quarter|50,20|TimesRoman,BI,18|100,100,100
Html Code Example :
<PARAM name="title" value="Sales by Quarter|50,20|TimesRoman,BI,18|100,100,100">
Parameter Name : xtitle
Description : Defines the x axis title for the graph. This parameter is made up of four elements each separated by a | character. The four elements represent, Title Text, Title Position, Font and Text Color.
Range of Values : Text | Position | Font definition | Color definition.
File Example : xtitle Year 2000|200,400|TimesRoman,B,16|100,100,100
Html Code Example :
<PARAM name="xtitle" value="Year 2000|200,400|TimesRoman,B,16|100,100,100">
Parameter Name : ytitle
Description : Defines the y axis title for the graph. This parameter is made up of four elements each separated by a | character. The four elements represent, Title Text, Title Position, Font and Text Color.
Range of Values : Text | Position | Font definition | Color definition.
File Example : ytitle Value $|10,300|TimesRoman,B,16|100,100,100
Html Code Example :
<PARAM name="ytitle" value="Value $|10,300|TimesRoman,B,16|100,100,100">
Free Form Text
In addition to the three title parameters, the graph allows for 10 additional lines of text to be added to the graph image. This is achieved via the "textN" parameter, where N can range from 1 to 10. As with the titles, the textN parameter is made up of four elements each separated by a | character. The four elements represent, Title Text, Title Position, Font and Text Color.
Range of Values : Text | Position | Font definition | Color definition.
File Example :
text1 Note :|80,60|TimesRoman,N,12|0,0,255
text2 New product range|80,80|TimesRoman,N,12|0,0,0
text3 launched during|80,100|TimesRoman,N,12|0,0,0
text4 quarter 2.|80,120|TimesRoman,N,12|0,0,0
Html Code Example :
<PARAM name="text1" value="Note :|80,60|TimesRoman,N,12|0,0,255">
<PARAM name="text2" value="New product range|80,80|TimesRoman,N,12|0,0,0">
<PARAM name="text3" value="launched during|80,100|TimesRoman,N,12|0,0,0">
<PARAM name="text4" value="quarter 2.|80,120|TimesRoman,N,12|0,0,0">
Free Form Images
The graph allows for the incorporation of upto 10 images/icons to be added to the graph image. This is achieved via the "imageN" parameter, where N can range from 1 to 10.
This feature is particularly useful where you wish to incorporate a company / product logo into the graph image. It can also be used to incorporate a custom designed legend into the graph image (in this case remember to turn off the automatic legend).
The imageN parameter is made up of three elements each separated by a , (comma) character. The three elements represent,
Image URL, X position, Y position.
Range of Values : URL , X position , Y position.
File Example :
image1 ./images/logo.gif,0,0
image2 ./images/legend.gif,210,0
Html Code Example :
<PARAM name="image1" value="./images/logo.gif,0,0">
<PARAM name="image2" value="./images/legend.gif,210,0">
Trend Lines
The graph allows for the incorporation of upto 10 trend lines. This is achieved via the "trend" parameter, where N can range from 1 to 10.
The trendN parameter is made up of seven elements each separated by a | character. The seven elements represent,
Color, Start Point, End Point, Start Value, End Value, Label, Label Font.
For example if we require a Red trend line to run from data point 3 to 10 with a starting value of 7500 and an end value of 10500 with a label of "Trend 1" we would have,
File Example :
trend1 175,0,0|3|10|7500|10500|trend 1|Arial,N,10
Html Code Example :
<PARAM name="trend1" value="175,0,0|3|10|7500|10500|trend 1|Arial,N,10">
Target Lines
The graph allows for the incorporation of upto 10 target lines. This is achieved via the "targetN" parameter, where N can range from 1 to 10.
The targetN parameter is made up of seven elements each separated by a | character. The seven elements represent,
Color, Line Style, Start Point, End Point, Value, Label, Label Font.
For example if we require a Green Target line to run from data point 1 to 12 with a value of 5500, with a label of "Target" we would have,
File Example :
target1 0,125,0|4|1|12|5500|Target|Arial,N,10
Html Code Example :
<PARAM name="target1" value="0,125,0|4|1|12|5500|Target|Arial,N,10">