RCHART TUTORIAL, Chapter 6

Copyright 2003, J4L Components (http://www.java4less.com)
Go bak to contents


Linechart configuration / parameters

 

Linechart

 

The following table constains an example of a linechart with 2 lines (series):

Parameters
Description
Equivalent Java[TM] class/property

TITLECHART=Sales 2001
XLABEL=Month
YLABEL=Million $
YSCALE_MIN=0
TICK_INTERVALY=2
BIG_TICK_INTERVALX=1
XAXIS_GRID=0.2|WHITE|DASHED
YAXIS_GRID=0.2|0xffffff|DASHED
GRIDY=true
XAXIS_LABELS=June|July|Aug.|Sept.|Oct.|Nov.|Dec.
YAXIS_START_WITH_BIG_TICK=true
LEGEND=FALSE
SERIE_1=Products
SERIE_2=Services
SERIE_FONT_1=Arial|PLAIN|8
SERIE_FONT_2=Arial|PLAIN|8
SERIE_COLOR_1=RED
SERIE_COLOR_2=BLUE
SERIE_DATA_1=12|43|50|45|30|32|42
SERIE_DATA_2=20|41|48|39|36|34|50
SERIE_STYLE_1=0.2|RED|LINE
SERIE_STYLE_2=0.2|BLUE|LINE
SERIE_POINT_2=false
SERIE_POINT_COLOR_1=RED
SERIE_POINT_COLOR_2=BLUE
LEGEND_POSITION=BOTTOM
LEFT_MARGIN=0.18
CHART_FILL=0xffcc00

Title
Definition of the scale




Activate grids

Grid at big ticks only
Labels of the x axis
Big tick at possition 0
Hide legend
Serie name

Font for value

color of font

values to be plotted

line style

do not paint points
color of points

possition of legend
Space reserved for y axis.
background color

new Title("Sales 2001");
chart.XLabel=new HAxisLabel("Month",Color,font);
chart.YLabel=new VAxisLabel("Million $",Color,font);
chart.YAxis.scale.min=0;
chart.XAxis.scaleTickInterval=2;
chart.XAxis.bigTickInterval=1;
chart.XAxis.gridStyle=new LimeStyle(...);
chart.YAxis.gridStyle=new LimeStyle(...);
chart.XAxis.bigTicksGrid=true;
chart.XAxis.tickLabels{"June",...};
chart.YAxis.startWithBigTick=true;
chart.legend=null;
serie1=new LineDataSerie(values,lineStyle);

serie1.valueFont=new Font(...);



see values in LineDataSerie constructor

see lineStyle in LineDataSerie constructor

serie2.drawPoint=false;
serie1.pointColor=Color.red;

chart.layout=Chart.LAYOUT_LEGEND_BOTTOM
chart.leftMargin=0.18;
chart.back=new Color(0xffcc00);

 

 

If you want to have a fixed maximum value for your Y Scale and leave some points outside the chart you can do it like this:

Parameters
Description
Equivalent Java[TM] class/property

YSCALE_MAX=50
YSCALE_MIN=0
SERIE_DATA_1=12|43|90|45|30|32|42
SERIE_DATA_2=20|31|38|39|36|34|50
LINECHART_FIXED_LIMITS=TRUE

Definition of the scale

Values to be plotter. The 90 is outside the chart
Allow points to be outside the chart

chart.XAxis.scale.max=50;
chart.XAxis.scale.max=0;


linePlotter.fixedLimits=true;

the result is:

 

If you serie has some missing points you can use NULL as value to paint a discontinued line. This feature is not compatible with (LINECHART_FIXED_LIMITS=TRUE)

Parameters
Description
Equivalent Java[TM] class/property

YSCALE_MAX=50
YSCALE_MIN=0
SERIE_DATA_1=12|43|50|45|30|32|42
SERIE_DATA_2=20|31|null|39|36|34|50

Definition of the scale

Values to be plotter. The null is a missing value (discontinued line)



Double[] values={new Double(20), new Double(30), null, ...};
serie2=new LineDataSerie(values,lineStyle);

As you see the blue series does not a value for July.

 

Areachart

Areacharts are exactly like linecharts, you only need to provide a fill color for the area. When designing these kind of charts keep in mind that serie 1 is painted first (in the background) and serie 2 in the foreground.

Parameters
Description
Equivalent Java[TM] class/property

SERIE_STYLE_1=0.2|0000|NORMAL
SERIE_STYLE_2=0.2|0|NORMAL
SERIE_FILL_1=0xff0000
SERIE_FILL_2=0xff

Black line used as border

Color used for filling the areas

see lineStyle in LineDataSerie constructor

serie1.fillStyle=new FillStyle(...);

 

Scatterchart

Scatter chart are linecharts where:

  1. no lines are painted between points (SERIE_DRAW_LINE_*=false).
  2. and you must provide the Y and X coordinates for each point (SERIE_DATA_* and SERIE_DATAX_*).

For example:

Parameters
Description
Equivalent Java[TM] class/property

SERIE_DATA_1=12|43|50|45|30|32|42|3|11
SERIE_POINT_1=TRUE
SERIE_DATAX_1=1|2|2|1|3|4|6|7|3|1|2
SERIE_DRAW_LINE_1=FALSE
SERIE_POINT_COLOR_1=0xff
LINECHART_POINT_SIZE=6

Y Values
Paint blue squares
X possition of the points.
Do not paint lines between points
Points are blue
Size of squares is 6 pixels

serie1=new LineDataSerie(values,lineStyle);
serie1.drawPoint=true;
serie1.setDatax(...);
lineStyle=null in LineDataSerie constructor
serie1.pointColor=new Color(...);
linePlotter.pointSize=6;

Other usefull parameters are:

 

You can also use images instead of squares for plotting the points:

Parameters
Description
Equivalent Java[TM] class/property

SERIE_POINT_IMAGE_1=point.gif

Use point.gif as image for the points

serie1.icon=image;

 

The format of the values (labels) painted next to the point can be changed with:

If you want to have 2 Y axis you must use the following parameter:

Parameters
Description
Equivalent Java[TM] class/property

SERIE_SECONDYAXIS_2=TRUE
Y2LABEL=Local Currency Y2LABEL_VERTICAL=TRUE Y2AXIS=TRUE

Y2SCALE_MIN=0
Y2SCALE_MAX=100 TICK_INTERVALY2=2 BIG_TICK_INTERVALY2=10 Y2AXIS_INTEGER=TRUE RIGHT_MARGIN=0.15

Second serie (blue) uses axis Y2 (right Y axis)
Definition of the Y2 axis
Activate right Y axis
Definition of the scale (0-100)




Space for the right axis

serie1.secondYAxis=true;
chart.Y2Label==new VAxisLabel("local currency",color,font);
Y2Label.vertical=true;
cY2Axis=new Axis(Axis.VERTICAL,scY2);
chart.setY2Scale(cY2Axis);
cY2Axis.scale.min=0;
cY2Axis.scale.max=100;
cY2Axis.scaleTickInterval=2;
cY2Axis.bigTickIntervaL=10;
cY2Axis.IntegerScale=true;
chart.rightMargin=0.15;

 

It is possible to define a different color for the chart's background and the plotter's background:

Parameters
Description
Equivalent Java[TM] class/property

CHART_FILL=0xffcc00
LINECHART_BACK=0xcccc00

Background color of the chart.
Background color of the plotter area.

chart.back=new Color(0xffcc00);
linePlotter.back = new Color(0xcccc00);

 

Tips

You can add tips to the points of your chart like this:

Parameters
Description
Equivalent Java[TM] class/property

SERIE_POINT_1=TRUE
SERIE_TIPS_1=12|43|50|45|30|32|42
CHART_SHOW_TIPS=TRUE

Tips require points to be activated
Tips for each point
Activate tips

Tips are available in the applet and servlet. Java application must implement tips using chartListener.paintUserExit().

 

 

Curves

RChart offers you 3 type of curves:

Parameters
Description
Equivalent Java[TM] class/property
SERIE_TYPE_1=CURVE Use cubic natural curves

com.java4less.rchart.CurvePlotter plot=new CurvePlotter();
lineDataSerie.lineType=LinePlotter.TYPE_CUBIC_NATURAL;

Parameters
Description
Equivalent Java[TM] class/property
SERIE_TYPE_1=B-SPLINES Use B-SPLines

com.java4less.rchart.CurvePlotter plot=new CurvePlotter();
lineDataSerie.lineType=LinePlotter.TYPE_B_SPLINES;

 

Parameters
Description
Equivalent Java[TM] class/property
SERIE_TYPE_1=LINE_LEAST_SQUARES Use least squares

com.java4less.rchart.CurvePlotter plot=new CurvePlotter();
lineDataSerie.lineType=LinePlotter.TYPE_LEAST_SQUARES_LINE;

 

OHLC and Candlestick

In order to create a Candlestick chart you must use the following additional parameters:

Parameters
Description
Equivalent Java[TM] class/property

SERIE_DATA_1=12|43|50|45|30|32|42 SERIE_MAX_DATA_1=18|48|55|53|35|45|44 SERIE_MIN_DATA_1=20|30|40|30|28|20|34 SERIE_CLOSE_DATA_1=15|38|45|50|28|35|40
SERIE_LINE_TYPE_1=CANDLESTICK
SERIE_CANDLE_POSITIVE_COLOR_1=0xff00
SERIE_CANDLE_NEGATIVE_COLOR_1=0xff0000

SERIE_MAXMIN_STYLE_1=0.2|0xff|NORMAL

Open values
Maximum values
Minimum values
Close values
Select candlestick type
Color of candlesitck is open<close
Color of candlesitck is open>close

Style of the line

serie= new MaxMinDataSerie(values, maxValues, minValues, closeValues, lineStyle);


linePlotter.MaxMinType= linePlotter.MM_CANDLESTICK


serie.maxminStyle=new LineStyle(...);


If you want to create a OHLC chart you must change the SERIE_LINE_TYPE_1 parameter:

Parameters
Description
Equivalent Java[TM] class/property
SERIE_DATA_1=12|43|50|45|30|32|42
SERIE_MAX_DATA_1=18|48|55|48|35|35|44
SERIE_MIN_DATA_1=8|30|40|30|28|20|34
SERIE_CLOSE_DATA_1=9|33|45|40|28|30|40
SERIE_LINE_TYPE_1=OHLC
SERIE_OPENCLOSE_WIDTH_1=10
Open values
Maximum values
Minimum values
Close values
Select OHLC type
Length of the open/close lines

serie= new MaxMinDataSerie(values, maxValues, minValues, closeValues, lineStyle);


linePlotter.MaxMinType= linePlotter.MM_OHLC;

 

If you only want to display the maximum and minimum values (no open/close values) you can use:

Parameters
Description
Equivalent Java[TM] class/property

SERIE_LINE_END_1=TRUE
SERIE_DATA_1=12|43|50|45|30|32|42
SERIE_MAX_DATA_1=18|48|55|48|35|35|44
SERIE_MIN_DATA_1=8|30|40|30|28|20|34

Draw line end.
Open values
Maximum values
Minimum values


linePlotter.MaxMinType=linePlotter.MM_NORMAL;
serie= new MaxMinDataSerie(values,lineStyle);
serie.setMaxMinValues(maxValues,minValues);


 

 

Bubblechart

Bubblecharts will draw a circle around points of the line. The radius of the circle is defined using the SERIE_MAX_DATA_* parameter.

For example:

Parameters
Description
Equivalent Java[TM] class/property
SERIE_BUBBLE_1=TRUE
SERIE_FILL_BUBBLE_1=TRUE
SERIE_DATA_1=12|43|50|45|30|32|42
SERIE_MAX_DATA_1=2|3|4|3|2|2|3|2
Activate bubbles
Bubbles should be filled
Values of the points
Values of the radius of the bubbles in (Y axis units)

maxMinDataSerie.bubbleChart=true;
maxMinDataSerie.fillBubble=true;
maxMinDataSerie=new MaxMinDataSerie(data,lstyle);
maxMinDataSerie.setMaxMinValues(radiusValues,null);

if you want to remove the line and only point the bubbles you must use SERIE_DRAW_LINE_1=false;

 

Linechart 3D

In order to create a 3D linechart you only need to add the parameter: SERIE_TYPE_1=LINE3D (or use LinePlotter3D in Java[TM] code).

The order 3D specific parameters are:

Parameters
Description
Equivalent Java[TM] class/property

SERIE_TYPE_1=LINE3D
LINECHART3D_DEPTH=20 LINECHART3D_BORDER=0.2|BLACK|LINE LINECHART3D_BACK=WHITE
LINECHART3D_SEPARATOR=0

Use 3D lines
Length of the Z axis (depth)
Border of the surface of the line.
Space between lines.

linePlotter3D= new LinePlotter3D();
linePlotter3D.depth
linePlotter3D.border
linePlotter3D.back
linePlotter3D.interLineSpace

As in the 2D lineharts you can create an arechart by adding the fill color for the area.

Parameters
Description
Equivalent Java[TM] class/property

SERIE_FILL_1=0xff0000

Fill area with red color
serie1.fillStyle=new FillStyle(Color.red);