|
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
- Pie Data
- Segment Data
- Segment Labels
- Font Information
- Color Information
- Automatic Legend
- Titles
- 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">
|
|
|
Slabels |
Specifies
whether pie Segment labels should be drawn.
Range
of Values : true or false |
File Example :
Slabels:
true
Html Code Example :
<PARAM name="Slabels"
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"> |
|
|
displayPercentages |
Specifies
whether segment percentages should be automatically calculated and added to the segment labels
Range
of Values : true or false |
File Example :
displayPercentages:
true
Html Code Example :
<PARAM name="displayPercentages"
value="true"> |
|
|
labellines |
Specifies
whether the a line should be drawn between
each label and the segment.
Range
of Values : true or false |
File Example :
labellines:
true
Html Code Example :
<PARAM name="lablellines"
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 |
|
|
nPies |
Defines
the number of pie charts within the graph
area (eg. If you have 3 series each with
up to 8 pieces of data then this should be
set to 3 to draw the data as 3 pie charts).
Range
of Values : Positive Integer |
File Example :
nPies:
3
Html Code Example :
<PARAM name="nPies"
value="3"> |
|
|
depth3D |
Defines
the 3D depth of each Pie .
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
segment values.
Range
of Values : Positive Integer |
File Example :
ndecplaces:
2
Html Code Example :
<PARAM name="ndecplaces"
value="2"> |
|
|
3Dangle |
Defines the angle (in the z plane) with which
to draw each pie
Range
of Values : 0 - 90 where 0 represents
a flat full on pie (2D) and 90 fully rotated
in the z plane. |
File Example :
3Dangle:
50
Html Code Example :
<PARAM name="
3Dangle"
value="50"> |
|
|
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"> |
|
|
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
Pie
Data
|
For
each Pie, 5 characteristics can be defined,
- x position
- y position
- Size
- Number of Segments
- Segment Separation
These
are supplied via the "PieN" parameter
(where N is an integer ranging from 1 to the total
number of Pies). Each element is separated by
a comma character.
Range
of Values : +ve integer, +ve integer, +ve integer,
+ve integer, +ve integer
For
example if we have 3 Pies,
File
Example :
Pie1: 50,75,150,6,0
Pie2: 350,75,150,6,10
Pie3: 175,250,150,6,10
Html
Code Example :
<PARAM
name="Pie1" value="50,75,150,6,0">
<PARAM name="Pie2" value="350,75,150,6,10">
<PARAM name="Pie3" value="175,250,150,6,10">
|
^back to top
Segment
Data
|
For
each series of data (segments of the pies), 4
characteristics can be defined,
- Segment Color
- Legend Label
- Legend Link URL (or JavaScript function)
- Legend Link Target Window/Frame
These
are supplied via the "segmentN" parameter
(where N is an integer ranging from 1 to the total
number of series). Each element is separated by
a | character.
Range
of Values : Color definition | Text | URL |
Window or Frame name
(Click here for More on
Defining colors)
For
example if we have 5 series of the data (5 segments
on each pie),
File
Example :
segment1: red|North America|http://www.jpowered.com
segment2: 99,99,156|Europe
segment3: green|Asia|http://www.jpowered.com/|_self
segment4: blue|Africa|http://www.trafficfile.com|new
segment5: 0,63,68|Australia
Html
Code Example :
<PARAM
name="segment1" value="red|North
America|http://www.jpowered.com">
<PARAM name="segment2" value="99,99,156|Europe">
<PARAM name="segment3" value="green|Asia|http://www.jpowered.com/|_self">
<PARAM name="segment4" value="blue|Africa|http://www.trafficfile.com|new">
<PARAM name="segment5" value="0,63,68|Australia">
|
^back to top
Segment
Labels
|
The
Segment labels for each Pie are supplied by the
pieNlabelM parameter, where N & M are
positive integers starting with 1.
There
should one pieNlabelM parameter for each
segment on each pie. N represents the Pie
number and M the segment within that pie.
If
you have 2 pies each with 6 segments then the
following would be required,
File
Example :
pie1label1:
North America
pie1label2: Europe
pie1label3: Asia
pie1label4: Africa
pie1label5: Australia
pie1label6: South America
pie2label1:
North America
pie2label2: Europe
pie2label3: Asia
pie2label4: Africa
pie2label5: Australia
pie2label6: South America
Html
Code Example :
<PARAM
name="pie1label1"
value="North America">
<PARAM name="pie1label2"
value="Europe">
<PARAM name="pie1label3"
value="Asia">
<PARAM name="pie1label4"
value="Africa">
<PARAM name="pie1label5"
value="Australia">
<PARAM name="pie1label6"
value="South America">
<PARAM
name="pie2label1"
value="North America">
<PARAM name="pie2label2"
value="Europe">
<PARAM name="pie2label3"
value="Asia">
<PARAM name="pie2label4"
value="Africa">
<PARAM name="pie2label5"
value="Australia">
<PARAM name="pie2label6"
value="South America">
|
^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 |
| popupfont |
Defines
the font for the pop-up segment 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">
|
|
|
slabelfont |
Defines the font for the segment labels.
Range of Values : Font
Definition
(click here for More on
Defining fonts) |
File Example :
slabelfont:
Arial,B,10
Html Code Example :
<PARAM name="slabelfont"
value="Arial,B,10"> |
|
^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"> |
|
|
labelcolor |
Defines
the segment 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"> |
|
| popupbgcolor |
Defines
the background color of the pop-up value display.
Range of Values :
Color Definition
(click here for More
on Defining colors) . |
File Example :
popupbgcolor:
#303030
Html Code Example :
<PARAM name="popupbgcolor" 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
Title
| 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">
|
|
^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
|
[
