|
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 : Parameter Names are case sensitive. ( i.e. axis is not
the same as Axis ).
- Graph Switches
- Graph Characteristics
- Graph Characteristics (Double Precision, Real & decimal Values)
- Series Characteristics
- Labels
- Font Information
- Color Information
- Automatic Legend
- Titles
- Free Form Text
- Free Form Images
- Trend Lines
- Target Lines
Graph Switches
( Boolean flags )
| Parameter |
Description |
Example |
| 3D |
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"> |
|
| grid |
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"> |
|
| axis |
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"> |
|
| ylabels |
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"> |
|
| legend |
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"> |
|
| outline |
Specifies
whether each area should outlined
Range of Values : true or false |
File Example :
legend:
outline
Html Code Example :
<PARAM name="outline" value="true">
|
|
| autoscale |
The
graph can automatically work out the scale of the graph from the data values.
Range of Values : true or false |
File Example :
autoscale:
true
Html Code Example :
<PARAM name="autoscale" value="true">
|
|
^back to top
Graph
Characteristics
| Parameter |
Description |
Example |
| width |
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 :Positive Integer |
File Example :
width: 500
|
|
| height |
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 : Positive Integer |
File Example :
height: 420
|
|
| nPoints |
Defines
the maximum number of points per series (eg. If you have 3 series each with up to 12 pieces of data then this should
be set to 12).
Range of Values : Positive Integer |
File Example :
nPoints: 12
Html Code Example :
<PARAM name="nPoints"
value="12"> |
|
| nRows |
Defines
the number of rows for this graph grid
Range of Values :Positive Integer |
File Example :
nRows: 7
Html Code Example :
<PARAM name="nRows"
value="7"> |
|
| vSpace |
Defines
the number of pixel for each row.
Range of Values :Positive Integer |
File Example :
vSpace: 30
Html Code Example :
<PARAM name="vSpace"
value="30"> |
|
| nSeries |
Defines
the number of series of data for this graph (eg. If you have 3 series each with 12 pieces of data then this should be
set to 2).
Range of Values : Positive Integer |
File Example :
nSeries: 2
Html Code Example :
<PARAM name="nSeries"
value="2"> |
|
| hSpace |
Defines the horizontal interval in pixels between data points.
Range of Values : Positive Integer |
File Example :
hSpace: 30
Html Code Example :
<PARAM name=" hSpace"
value="30"> |
|
| gridxpos |
Defines the starting x position for the graph grid relative
to the left edge of the image.
Range of Values : Positive Integer |
File Example :
gridxpos:
75
Html Code Example :
<PARAM name=" gridxpos"
value="75"> |
|
| gridypos |
Defines the starting y position for the graph grid relative
to the top edge of the image.
Range of Values : Positive Integer |
File Example :
gridypos:
350
Html Code Example :
<PARAM name="gridypos"
value="350"> |
|
| gridystyle |
Defines the line style for the grid lines.
Range of Values : Positive Integer
- 1 - Solid Line
- 2 - Dotted Line
- 3 - Short Dashes
- 4 - Long Dashes
|
File Example :
gridstyle:
1
Html Code Example :
<PARAM name="gridstyle"
value="1"> |
|
| depth3D |
Defines the depth of the 3D effect .
Range of Values : Positive Integer |
File Example :
depth3D:
15
Html Code Example :
<PARAM name=" depth3D"
value="15"> |
|
| ndecplaces |
Defines the number of decimal places to use when displaying
values.
Range of Values : Positive Integer |
File Example :
ndecplaces:
2
Html Code Example :
<PARAM name="ndecplaces"
value="2"> |
|
| labelOrientation |
Defines the orientation of the x-axis labels.
Range of Values : Positive Integer
- Horizontal Left to Right
- 1 - Vertical Top to Bottom
- 2 - 45 degree angle LtoR, BtoT
- 3 - Vertical Bottom to top
- 4 - Horizontal (common end)
- 5 - 45 degree LtoR TtoB
- 6 - Vertical (common end)
|
File Example :
labelOrientation:
30
Html Code Example :
<PARAM name=" labelOrientation"
value="30"> |
|
| labelsY |
Y position of the x-axis labels.
Range of Values : Positive Integer |
File Example :
labelsY:
375
Html Code Example :
<PARAM name=" labelsY"
value="375"> |
|
| labelsYpre |
Specifies any characters to placed at the beginning of the Y axis labels e.g. a currency symbol.
Range of Values : Alphanumeric |
File Example :
labelsYpre: $
Html Code Example :
<PARAM name=" labelsYpre"
value="$"> |
|
| labelsYpost |
Specifies any characters to placed at the end of the Y axis
labels e.g. a measurement symbol.
Range of Values : Alphanumeric |
File Example :
labelsYpost: Kg
Html Code Example :
<PARAM name="labelsYpost"
value="Kg"> |
|
^back to top
Graph
Characteristics ( Double Precision, Real, Decimal Values )
Please note: If "autoscale" is turned on then the
following 2 parameters are ignored.
| Parameter |
Description |
Example |
| chartScale |
Defines the value each row represents .
Range of Values : true or false |
File Example :
chartScale:
30.0
Html Code Example :
<PARAM name="chartScale"
value="30.0"> |
|
| chartStartY |
Defines the starting value for the graph (i.e. the
value the x-axis represents)
Range of Values : true or false |
File Example :
chartStartY:
0.0
Html Code Example :
<PARAM name="chartStartY"
value="0.0"> |
|
^back to top
Series Characteristics
|
For each series of data, five characteristics can be defined, Area 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">
|
^back to top
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">
|
^back to top
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 |
Description |
Example |
| yFont |
Defines the font for the Y axis labels.
Range of Values : Font Definition
(click here for More on Defining fonts) . |
File Example :
yFont:
Arial,N,12
Html Code Example :
<PARAM name="yFont"
value="Arial,N,12"> |
|
| xFont |
Defines the font for the X axis labels.
Range of Values : Font Definition
(click here for More on Defining fonts) |
File Example :
xFont:
Arial,N,12
Html Code Example :
<PARAM name="xFont" value="Arial,N,12">
|
|
^back to top
Color Information
Most of the color information is incorporated into other parameters (see Titles below) however the following eight
colors are defined as follows,
| Parameter |
Description |
Example |
| BgColor |
Defines the background color for the graph image.
Range of Values : Color Definition
(click here for More on Defining colors) . |
File Example :
BgColor: #FFFFFF
Html Code Example :
<PARAM name="BgColor" value="white">
|
|
| gridbg |
Defines
the background color of the grid area.
Range of Values : Color Definition
(click here for More on Defining colors) . |
File Example :
gridbg:
white
Html Code Example :
<PARAM name="gridbg" value="#FFFFFF">
|
|
| gridcolor |
Defines
the grid color
Range of Values : Color Definition
(click here for More on Defining colors) . |
File Example :
gridcolor:
light grey
Html Code Example :
<PARAM name="gridcolor" value="#AAAAAA">
|
|
| axiscolor |
Defines
the axis color.
Range of Values : Color Definition
(click here for More on Defining colors) . |
File Example :
axiscolor:
#0000FF
Html Code Example :
<PARAM name="axiscolor" value="#0000FF">
|
|
| floorcolor |
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 :
floorcolor:
light grey
Html Code Example :
<PARAM name="floorcolor" value="#AAAAAA">
|
|
| outlinecolor |
Defines
the outline color.
Range of Values : Color Definition
(click here for More on Defining colors) . |
File Example :
outlinecolor:
black
Html Code Example :
<PARAM name="outlinecolor" value="black">
|
|
| labelcolor |
Defines
the x axis label text color.
Range of Values : Color Definition
(click here for More on Defining colors) . |
File Example :
labelcolor:
#000000
Html Code Example :
<PARAM name="labelcolor" value="#000000">
|
|
| Ycolor |
Defines
the Y axis label text color.
Range of Values : Color Definition
(click here for More on Defining colors) . |
File Example :
Ycolor:
#303030
Html Code Example :
<PARAM name="Ycolor" value="#303030">
|
|
^back to top
Automatic Legend
The following set of parameters define the characteristics of the automatic legend,
| Parameter |
Description |
Example |
| legendfont |
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">
|
|
| legendposition |
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:
345,15
Html Code Example :
<PARAM name="legendposition" value="345,15">
|
|
| legendtitle |
The text for legend title.
Range of Values : text |
File Example :
legendtitle:
Products
Html Code Example :
<PARAM name="legendtitle" value="Products">
|
|
| legendBackground |
Legend
background color
Range of Values : Color Definition
(click here for More on Defining colors) . |
File Example :
LegendBackground:
166,210,255
Html Code Example :
<PARAM name="LegendBackground" value="166,210,255">
|
|
| legendBorder |
Legend
border color
Range of Values : Color Definition
(click here for More on Defining colors) . |
File Example :
LegendBorder:
light grey
Html Code Example :
<PARAM name="LegendBorder" value="#AAAAAA">
|
|
| legendtextColor |
Legend
text color
Range of Values : Color Definition
(click here for More on Defining colors) . |
File Example :
LegendtextColor:
black
Html Code Example :
<PARAM name="LegendtextColor" value="black">
|
|
^back to top
Graph Titles
| Parameter |
Description |
Example |
| title |
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|Arial,BI,18|grey
Html Code Example :
<PARAM name="title"
value="Sales
by Quarter|50,20|Arial,BI,18|grey"> |
|
| xtitle |
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 2002|200,400|Arial,B,16|grey
Html Code Example :
<PARAM name="xtitle"
value="Year 2002|200,400|Arial,B,16|grey">
|
|
| ytitle |
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|Arial,B,16|grey
Html Code Example :
<PARAM name="ytitle"
value="Value
$|10,300|Arial,B,16|grey"> |
|
^back to top
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">
|
^back to top
Free Form Images
|
The graph allows for the incorporation of up to 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">
|
^back to top
Trend Lines
|
The graph allows for the incorporation of up to 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">
|
^back to top
Target Lines
|
The graph allows for the incorporation of up to 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">
|
^back to top |
[
