Advanced
Line Graph, version 3.2
by Sirius Computer Consultants Limited
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 : 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,
- 1
- Solid Line
- 2
- Dotted Line
- 3
- Short Dashes
- 4
- Long Dashes
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
- 0
- Horizontal Left to Right
- 1
- Vertical Top to Bottom
- 2
- 45 degree angle LtoR, BtoT
- 3
- Vertical Bottom to top
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,
- 0 - Dot ( default )
- 1 - Cross ( + )
- 2 - Cross ( X )
- 3 - Box
- 4 - Triangle
- 5 - Diamond
- 6 - Circle
- 7 - Hexagon
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 4
Html
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 : 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">