|
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
- Graph Characteristics
- Grid Properties
- Label Properties
- Bar Labels
- Automatic Legend
- Titles
- Series Characteristics
- Target Lines
- Free Form Text
- Free Form Images
- Multi-Language Support
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 axis should be drawn
Range
of Values : true or false |
File Example :
axis:
true
Html Code Example :
<PARAM name="axis"
value="true"> |
|
|
xlabels |
Specifies
whether the x-axis labels should be drawn
Range
of Values : true or false |
File Example :
xlabels:
true
Html Code Example :
<PARAM name="xlabels"
value="true"> |
|
|
outline |
Specifies
whether the bars should be outlined
Range
of Values : true or false |
File Example :
outline:
true
Html Code Example :
<PARAM name="outline"
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"> |
|
|
autoscale |
Specifies
whether automatic scaling should be used
Range
of Values : true or false
|
File Example :
autoscale:
true
Html Code Example :
<PARAM name="autoscale"
value="true"> |
|
|
gradientfill |
If
set to true then the bars will painted with
a shading type effect.
Range
of Values : true or false |
File Example :
gradientfill:
true
Html Code Example :
<PARAM name="gradientfill"
value="true"> |
|
^back to top
Graph
Characteristics
| Parameter |
Description |
Example |
| width |
Specifies 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 |
Specifies 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 |
|
|
nCols |
Defines
the number of data points in each series.
i.e. the number of Horizontal bars.
Range
of Values : Positive Integer |
File Example :
nCols:
4
Html Code Example :
<PARAM name="nCols"
value="3"> |
|
|
nRows |
Defines
the number of x-axis grid portions
Range
of Values : Positive Integer |
File Example :
nRows:
7
Html Code Example :
<PARAM name="nRows"
value="10"> |
|
|
ndecplaces |
Defines
the number of decimal places to use when displaying
segment values.
Range
of Values : Positive Integer |
File Example :
ndecplaces:
2
Html Code Example :
<PARAM name="ndecplaces"
value="2"> |
|
|
nSeries |
Specifies
the number of series of data
Range
of Values : Positive Integer |
File Example :
nSeries:
3
Html Code Example :
<PARAM name="nSeries"
value="4"> |
|
chartScale |
If
"autoscale" if off then this specifies
the value each y-grid line represents.
Range
of Values : Positive Double / Float
/ Decimal
|
File Example :
chartScale:
100
Html Code Example :
<PARAM name="chartScale"
value="0.2"> |
|
chartStartX |
If
"autoscale" if off then this specifies
the starting value for the x-axis.
Range
of Values : Positive or Negative Double
/ Float / Decimal
|
File Example :
chartStartX:
0
Html Code Example :
<PARAM name="chartStartX"
value="1000"> |
|
hSpace |
Specifies
the horizontal spacing of the grid lines.
This figure represents the number of pixels between
the grid lines.
Range
of Values : Positive Integer
|
File Example :
hSpace:
30
Html Code Example :
<PARAM name="hSpace"
value="30"> |
|
labelsX |
Specifies
the Y-position of the x-axis labels.
Range
of Values : Positive Integer
|
File Example :
labelsX:
350
Html Code Example :
<PARAM name="labelsX"
value="350"> |
|
labelsX_offset |
Every
other label will be drawn this number of pixels
below the non-offset labels.
Range
of Values : Positive Integer
|
File Example :
labelsX_offset:
15
Html Code Example :
<PARAM name="labelsX_offset"
value="15"> |
|
bar_spacing |
Specifies
the gap between bars
Range
of Values : Positive Integer
|
File Example :
bar_spacing:
10
Html Code Example :
<PARAM name="bar_spacing"
value="0"> |
|
barwidth |
Specifies
the width of each bar
Range
of Values : Positive Integer
|
File Example :
barwidth:
15
Html Code Example :
<PARAM name="barwidth"
value="25"> |
|
depth3D |
depth
of the 3D effect
Range
of Values : Positive Integer
|
File Example :
depth3D:
15
Html Code Example :
<PARAM name="depth3D"
value="25"> |
|
linkCursor |
Defines the Cursor to be displayed when the mouse
passes over a clickable area
Range
of Values :
crosshair
default
hand
move
text
wait
|
File Example :
linkCursor:
hand
Html Code Example :
<PARAM name="linkCursor"
value="hand"> |
|
BackgroundColor |
Specifies
the background color for the whole chart area
Range of Values :
Color Definition
(click here for More on Defining
colors) .
|
File Example :
BackgroundColor:
#FFFFFF
Html Code Example :
<PARAM name="BackgroundColor"
value="white"> |
|
barOutlineColor |
Specifies
the outline color for the bars
Range of Values :
Color Definition
(click here for More on Defining
colors) .
|
File Example :
barOutlineColor:
#505050
Html Code Example :
<PARAM name="barOutlineColor"
value="dark grey"> |
^back to top
Grid
Properties
| Parameter |
Description |
Example |
|
gridxpos |
Specifies
the position of the left hand side of the
grid
Range
of Values : Positive Integer |
File Example :
gridxpos
:
75
Html Code Example :
<PARAM name="gridxpos"
value="100"> |
|
|
gridypos |
Specifies
the position of the bottom of the grid
Range
of Values : Positive Integer |
File Example :
gridypos
:
350
Html Code Example :
<PARAM name="gridypos"
value="400"> |
|
|
hSpace |
Specifies
the size in pixels of each y-axis grid portion
Range
of Values : Positive Integer |
File Example :
hSpace
:
30
Html Code Example :
<PARAM name="hSpace"
value="40"> |
|
gridstyle |
Defines
the line style with which to draw the grid lines.
Range
of Values : Positive Integer
1 - Solid Line
2 - Dotted Line
3 - Dashed, short
4 - Dashed, long
|
File Example :
gridstyle:
2
Html Code Example :
<PARAM name="gridstyle"
value="2"> |
|
gridbgcolor |
Specifies
the background color for the grid area
Range of Values :
Color Definition
(click here for More on Defining
colors) .
|
File Example :
gridbgcolor:
#808080
Html Code Example :
<PARAM name="gridbgcolor"
value="light blue"> |
|
gridbgimage |
provides
the ability to specify an image for the background
of the grid area.
Range
of Values : URL to image file
|
File Example :
gridbgimage:
gridbg.gif
Html Code Example :
<PARAM name="gridbgimage"
value="gridbg.gif"> |
|
gridColor |
Specifies
the color of the grid lines
Range of Values :
Color Definition
(click here for More on Defining
colors) .
|
File Example :
gridColor:
#A0A0A0
Html Code Example :
<PARAM name="gridColor"
value="grey"> |
|
axisColor |
Specifies
the color of the axis lines
Range of Values :
Color Definition
(click here for More on Defining
colors) .
|
File Example :
axisColor:
#000000
Html Code Example :
<PARAM name="axisColor"
value="black"> |
|
floorColor |
Specifies
the floor color for the grid area. (not relevant
in 2D mode).
Range of Values :
Color Definition
(click here for More on Defining
colors) .
|
File Example :
gridbgColor:
red
Html Code Example :
<PARAM name="gridbgColor"
value="#FF0000">
|
^back to top
Label
Properties
| Parameter |
Description |
Example |
| ylabel_font |
Defines
the font for the y labels
Range of Values : Font
Definition
(click here for More on Defining
fonts) . |
File Example :
ylabel_font:
Arial,N,10
Html Code Example :
<PARAM name="ylabel_font"
value="Arial,N,10"> |
| xlabel_font |
Defines
the font for the x labels
Range of Values : Font
Definition
(click here for More on Defining
fonts) . |
File Example :
xlabel_font:
Arial,N,10
Html Code Example :
<PARAM name="xlabel_font"
value="Arial,N,10"> |
| popupfont |
Defines
the font for the pop-up values.
Range of Values : Font
Definition
(click here for More on Defining
fonts) . |
File Example :
popupfont:
Arial,N,10
Html Code Example :
<PARAM name="popupfont"
value="Arial,N,10"> |
|
labelColor |
Specifies
the color of the labels.
Range of Values :
Color Definition
(click here for More on Defining
colors) .
|
File Example :
labelColor:
black
Html Code Example :
<PARAM name="labelColor"
value="#000000">
|
|
popupbgcolor |
Specifies
the bg color of the pop-up labels.
Range of Values :
Color Definition
(click here for More on Defining
colors) .
|
File Example :
popupbgcolor:
light blue
Html Code Example :
<PARAM name="popupbgcolor"
value="#5555FF">
|
|
xlabel_pre |
Specifies any characters to placed at the beginning
of the Xaxis labels e.g. a currency symbol.
Range
of Values : Alphanumeric |
File Example :
xlabel_pre:
$
Html Code Example :
<PARAM name="x
label_pre"
value="$"> |
|
xlabel_post |
Specifies
any characters to placed at the end of the X axis
labels
e.g. a measurement or percent symbol.
Range
of Values : Alphanumeric |
File Example :
xlabel_post:
Kg
Html Code Example :
<PARAM name="xlabel_post"
value="%"> |
|
popup_pre |
Specifies any characters to placed at the beginning
of the pop-up labels
e.g. a currency symbol.
Range
of Values : Alphanumeric |
File Example :
popup_pre:
$
Html Code Example :
<PARAM name="popup_pre"
value="$"> |
|
popup_post |
Specifies
any characters to placed at the end of the pop-up
labels
e.g. a measurement symbol.
Range
of Values : Alphanumeric |
File Example :
xlabel_post:
Kg
Html Code Example :
<PARAM name="popup_post"
value="Kg"> |
|
thousandseparator |
Specifies the character to be used as a thousand separator.
Range
of Values : Alphanumeric |
File Example :
thousandseparator:
,
Html Code Example :
<PARAM name="thousandseparator"
value=","> |
^back to top
Bar
Labels
|
The
y-axis labels are supplied by the labelN parameter,
where N represents an integer number starting
with 1. There should be the same number of labels
as the number of datapoints in each series (ie.
as specified by the nCols parameter above).
So
if you have 2 series of data each with 4 data
values,
File
Example :
label1
Quarter 1
label2 Quarter 2
label3 Quarter 3
label4 Quarter 4
Html
Code Example :
<PARAM
name="label1" value="Quarter
1">
<PARAM name="label2" value="Quarter
2">
<PARAM name="label3" value="Quarter
3">
<PARAM name="label4" value="Quarter
4">
|
^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
Series
Characteristics
|
For
each series of data, 4 characteristics can be
defined:-
-
Bar Color
- Legend
text
- Legend Text Link URL
- Legend Text Link Target Frame
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 :
For
example if we have 3 series of the data,
File
Example :
series1: #F00000|Series 1|./link1.htm|framename
series2: #F000F0|Series 2|./link2.htm|framename
series3: #00F000|Series 3|./link3.htm|framename
Html
Code Example :
<PARAM
name="series1" value="#F00000|Series
1|./link1.htm|framename">
<PARAM name="series2" value="#F000F0|Series
2|./link2.htm|framename">
<PARAM name="series3" value="#00F000|Series
3|./link3.htm|framename">
|
^back to top
Target
Lines
|
The
graph allows for the incorporation of up to 20
target lines. This is achieved via the "targetN"
parameter, where N can range from 1 to 20.
The targetN parameter is made up of 5 elements
each separated by a | character. The 5 elements
represent,
Color, Line Style, Value, Label, Label Font.
For example if we require a Green Target line
with a value of 5500, with a label of "Target"
we would have,
File
Example :
target1:
0,125,0|4|5500|Target|Arial,N,10
Html
Code Example :
<PARAM
name="target1" value="0,125,0|4|5500|Target|Arial,N,10">
|
^back to top
Free
Form Text
|
In
addition to the title parameter, the graph allows
for an unlimited number of lines of text to be
added to the graph image. This is achieved via
the "textN" parameter, where N is a
positive integer starting with 1.
This
feature is particularly useful where you wish
to add notes or individual titles to each pie.
As
with the title, the textN parameter is made up
of four elements each separated by a | character.
The four elements represent,
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 any number of images/icons to
be added to the graph image. This is achieved
via the "imageN" parameter, where N
is a positive integer starting with 1.
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
|
[
