CHART

Refer : Chart Tutorial

Description:

This tag is used to create Charts.

TheTag:
 



<Chart
X="xx"
Y="yy"
W="Width in Pixels"
H="Height in Pixels"
FG="ForegroundColor"
BG="BackgroundColor"
BRDR="BorderColor"
SELFG="Selected ForegroundColor"
SELBG="Selected BackgroundColor"
HIDDEN="Determines if the control is Hidden (1) or not (default 0)"
NAME="Name OF the Control"
STYLE= "Style of the text displayed"

XDivs="Number of Legend Divisions in X Axis"
YDivs="Number of Legend Divisions in Y Axis"
XHasValues="Determines if X has values, if 0 then the charter is a TimeSeries Chart"

Gap="Bar Chart Gap/Point Chart Button Width"
StartGap="1 Creates a gap in the begining of the chart for BarCharts"
Thickness="Like Thickness"

XLegFont="X Font Legend"
YLegFont="Y Font Legend"
XLegStyle="X Legend Style"
YLegStyle="Y Legend Style"

ChartBg="Background Color of the chart"
ChartBrdr="Border Color of the chart"
ChartGradDir="Chart BG Gradient Color "
XLegCol="X Legend Text Color"
YLegCol="X Legend Text Color"
XGridCol="X Legend Grid Color"
YGridCol="X Legend Grid Color"

YLegFormat="X Legend Numeric Format Ex: 10.2"
XLegFormat="Y Legend Numeric Format Ex: 10.2"

XLegLabel="X Legend Label"
XLegLabStyle="X Legend Label Style"
ShowXLeg="Flag Determines if X Legend Should be displayed"


YLegLabel="Y Legend Label"
YLegLabStyle="Y Legend Label Style"
ShowYLeg="Flag Determines if Y Legend Should be displayed"

FlipXY="Flip Charts XY."
HideGrid="Determines the Grid Lines to Hide."

ShowCursor="1/0 Determines if the Chart Cursor IsDisplayed (Keyboard Selection of bars etc)"
/>

For further information, please refer to Chart Tutorial

Common Attributes


Special Attributes.
AttrName Description GBasic Property GBasic Sample
ChartTypeAll Chart Type For all the Data Series in the chart.
This can be overridden by specifying ChartType
property for each data series.

BAR_CHART  - 1
LINE_CHART  - 2
POINT_CHART  - 4 
PIE_CHART     - 8

These Values can be added to get Multiple charts.
Ex: (2+4)=6 will give a Line chart with Points.

NOTE: For Pie Charts the Point Values should be above 1. 		ChartTypeAll
#Chart1.ChartTypeAll= 1
XDivs Number of Legend Divisions in X Axis
   		XDivs
#Chart1.XDivs  = 5
YDivs Number of Legend Divisions in Y Axis
   		YDivs #Chart1.YDivs  =5
XHasValues Determines if X has values, if 0 then the charter is a TimeSeries Chart.

When XHasValues=1 is specified then the X Axis Max Min is calculated , normalized and
Plotted as values.

WhenXHasValues=0 the X Axis is assumed to be time series where each point is plotted
equidistant.
   		XHasValues XHasValues =1
 Gap When Plotting Barcharts, This attribute determines Bar Chart Gap. 

When Poltting Point, This attribute determines Point Width. 

When Plotting Pie Charts This Attribute Determines the Gap Between the Pie Segments.
 		Gap

#Chart1.Gap=8
StartGap

When StartGap=0 the Charts First Point is on Leftmost X Axis and The Last point is on the Rightmost Point in the Chart.

When StartGap=1 a Gap between the First Point
and the Left X Axis is created so that the Bar charts is centered on the X Axis Point.

 StartGap #chart1.StartGap= 1
Thickness

Thickness of the Chart Lines (Allowed Values 1/2 ).

When plotting Pie Charts this attribute determines the Shadow Height.


  

Thickness

print #Chart1.Thickness

#Chart1.Thickness=  2  
ShowXLeg Determins if X Legend is Displayed (0/1/2)
0 - XLegend is Hidden
1 - XLegend is Displayed using Horizontal Text.
2 - XLegend is Displayed using Vertical Text.
 ShowXLeg#Chart1.ShowXLeg=1
ShowYLeg Determins if Y Legend is Displayed
0 - No Legend is Displayed.
1 - Y Legend is Displayed.

2 - Data Values for Points is displayed. 
3 - Y Legend and Data Values for Points is displayed. 		ShowYLeg#Chart1.ShowYLeg=1

WrapLeg
(Default 1)

(0/1)Determins if Text in Legends are wrapped. WrapLeg#Chart1.WrapLeg=1
XLegFont
YLegFont		 X,Y Legend Text Fonts XLegFont
YLegFont		#Chart1.XLegFont=5
#Chart1.YLegFont=5
XLegStyle
YLegStyle		 X,Y Legend Text Styles (Bold/Underline etc) XLegStyle
YLegStyle		#Chart1.XLegStyle=1
#Chart1.YLegStyle=1
YLegFormat
XLegFormat		 X,Y Legend Value Formats EX 10.2 YLegFormat$
XLegFormat$		#Chart1.YLegFormat$="10.2"
#Chart1.XLegFormat$="10.2"
XLegCol
YLegCol		 X,Y Legend Text Colors XLegCol
YLegCol		#Chart1.XLegCol=16
#Chart1.YLegCol=16
ChartBg
ChartGrad,ChartGradDir		 Background Color of the Chart
Chart Gradient Color and Direction
Chart BG Rounded Rect Radius 		ChartBg
ChartGrad,ChartGradDir
ChartBrdr Border Color of the chart ChartBrdr
XGridCol
YGridCol		 Color of the X and Y Grid Lines in the Chart. XGridCol
YGridCol
XLegLabel Label for the X Legend Displayed below the X Legend. XLegLabel$#Chart1.XLegLabel$="Year"
YLegLabel Label for the Y Legend Displayed Vertically Next to the Y Legend. YLegLabel$#Chart1.YLegLabel$="Price"
XLegLabStyle
YLegLabStyle		 Style of the X and Y Legend Labels. XLegLabStyle
YLegLabStyle
FlipXY

Flips the X and Y axis of a chart. This can be used for Horizontal Bar Charts.

FlipXY#Chart1.FlipXY=1
BaseY

Base Bar Chart (Chart Type - 17).

Base Bar chart is a special type of bar Chart
Where the Bars with values Below the Base Value are drawn downwards and the values above the Base Values are drawn upwards.

Ex: When showing Profit and Loss.

ChartTypeAll should be set to 17 For this type of
chart to be rendered.

 

 BaseY#Chart1.ChartTypeAll=17
#Chart1.BaseY=1000
Chart Legend
Properties		 Chart Legend is a small windows that displays the Chart Legend Texts when multi series charts are displayed.
When Displaying Pie charts this window displays the X Legend Texts for the various Pies.
ShowChartLeg This Attribute determines if the Chart Legend Shows up.

For Pie Charts.
ShowChartLeg =1 then Only the X legend Text for points is displayed.
ShowChartLeg =2 then Xleged Text and Y Value is displayed
ShowChartLeg =3 then Xleged Text and Y Percentage Value is displayed
ShowChartLeg =4 then Xleged Text and YValue and Y Percentage Value is displayed

For Bar/Line/Point Charts
ShowChartLeg =1 then the Chart Legend With Chart Labels is displayed.

For other values the Chart X Point Legend text is used.
ShowChartLeg =8+1 then Only the X legend Text for points is displayed.
ShowChartLeg =8+2 then Xleged Text and Y Value is displayed
ShowChartLeg =8+3 then Xleged Text and Y Percentage Value is displayed
ShowChartLeg =8+4 then Xleged Text and YValue and Y Percentage Value is displayed

Note: When Using Bar/line/point Charts that display X Legend Text, the Color array should be setup for the Legend Button Colors to match with Chart point Colors. 		ShowChartLeg#chart1.ShowChartLeg=1
ChartLegPos

This Attribute determines if the location of the Chart Legend.

ChartLegPos=1  - Legend Appears on the left of the chart.
ChartLegPos=2  - Legend Appears on the Right of the chart.
ChartLegPos=3  - Legend Appears on the Top of the chart.
ChartLegPos=4  - Legend Appears on the Bottom of the chart.
ChartLegPos=5  - Legend Appears at Top left inside chart.
ChartLegPos=6  - Legend Appears at Top Right inside chart.

 ChartLegPos#chart1.ChartLegPos=1
ClickedX

This Attribute Returns the X value of the Chart That corresponds to a
Mouse X Click Location.

This attribute is set to -1 if the click is not on a valid chart point.

 ClickedXprint #chart1.ClickedX
ClickedY

This Attribute Returns the Y value of the Chart That corresponds to a
Mouse Y Click Location.

This attribute is set to -1 if the click is not on a valid chart point.

 ClickedYprint #chart1.ClickedY
ClickedSeries

This Attribute Returns the Chart Series Mouse Click Location.

This attribute is set to -1 if the click is not on a valid chart point.

 ClickedSeriesprint #chart1.ClickedSeries
ChartLegBG
ChartLegGrad, ChartLegGradDir
 Background Color of the Chart Legend Rect.
Chart Gradient Color and Direction
Chart BG Rounded Rect Radius 		ChartLegBG
ChartLegGrad, ChartLegGradDir
ChartLegFG  Text Color of the Chart Legend Text. ChartLegFG
ChartLegBtnW Width of the Chart Legend Buttons . ChartLegBtnW
ChartGapScale This Attribute is used to scale the gaps etc on the chart. ChartGapScale
HideGrid This Attribute determines if the Grid should be hidden.
1 - Hides the Y (Horz) Grid Lines
2 - Hides the X (Vert) Grid Lines
3 - Hides the All Grid Lines
 HideGrid#HideGrid=2 ' Hide Vert Grid
Chart Componet Positions

Margins
LeftMargin
BottomMargin
TopMargin
RightMargin

Legend Window
ChartLegX
ChartLegY
ChartLegW
ChartLegH

Chart Window
ChartW
ChartH
These Attributes are readonly and are calculated automatically by the Chart
Control. 		LeftMargin
BottomMargin
TopMargin
RightMargin

ChartLegX
ChartLegY
ChartLegW
ChartLegH


ChartW
ChartH		print #chart1.LeftMargin
print #chart1.BottomMargin
print #chart1.TopMargin
print #chart1.RightMargin

print #chart1.ChartLegX
print #chart1.ChartLegY
print #chart1.ChartLegW
print #chart1.ChartLegH


print #chart1.ChartW
print #chart1.ChartH
Chart Max Min Values

YMin
YMax
XMin
XMax		 These Attributes are readonly and are calculated automatically by the Chart
Control. Min and Max are calculated from the data and normalized based
on the XDIVS/YDIVS parameters.

YMin
YMax
XMin
XMax



print #chart1.YMin
print #chart1.YMax
print #chart1.XMin
print #chart1.XMax


User MaxMin Values
UserYMax
UserYMin
UserXMax
UserXMin

NormMaxMin




 In Some cases it Might be necessary for the Max and Min Values to be Set from GBasic. For example if there is a wide variance in the data or there
are very few points. 

NormMaxMin property can be set to 1 to normalize the User Max Min Values.

Note: UserYMax UserYMin Values Should not be equal. If they are set to
The same value then they are ignored. Same Applies to UserXMax UserXMin.
 UserYMax
UserYMin
UserXMax
UserXMin

NormMaxMin



#chart1.UserYMin=50
#chart1.UserYMax=100

print #chart1.UserYMin
print #chart1.UserYMax

Chart Data Transformation
TfmX(X)
TfmY(Y)

Reverse
RTfmX(X)
RTfmY(Y)




 These properties let you transform an arbitrary point into chart Location.
This can be usefull for overlaying Lines, Rectangles and text onto an existing chart.

Note: This property works only after the chart is painted after a SetData Method. So incase you need these values before the chart has a chance to paint then you need to call #chart1.Paint(0) method.
 TfmX
TfmY


RTfmX
RTfmY

 print #chart1.TfmX(2)
print #chart1.TfmY(342)
End

sub form_paint
TfmX=#Chart1.TfmX(2)+#chart1.x
TfmY=#Chart1.TfmY(3600)+#chart1.y
fillrect(TfmX,TfmY,10,10,100)
end sub

Example of Base Line:
TfmY=#Chart1.TfmY(3600)
x1=#chart1.x+#chart1.LeftMargin
x2=#chart1.x+#chart1.LeftMargin+#chart1.ChartW
y=#chart1.y+TfmY
drawline(x1,y,x2,y,2,1020)

DispData




 These property gets/sets the number of points being displayed. (Set Initially using
SetData Method).

SetData overwrites this property. 		DispData print #chart1.DispData
ScrollStart




 This Property Can be be used to Set the Scroll Start for Data Points. ScrollStart #Chart1.SetData(a,,,0,100,10)
#Chart1.ScrollStart=50

CurDispSel




 This Property Can be be used to Set the Current Display Point. CurDispSel print #Chart1.CurDispSel+#Chart1.ScrollStart

ShowCursor

(Default 1.)



 (0/1)This Property determines if the Chart Cursor is Displayed or not. ShowCursor #Chart1.ShowCursor=0

PtBrdrCol Border Color of points.

For Bar and Point charts if PtBrdrCol=0 then the Border Color is set to the  Point's color.

For Pie charts this is the factor by which the Pie Color is reduced to
create the shadow Color.
 PtBrdrCol

'Blue Border
#chart1.PtBrdrCol=32

'Pie
#chart1.PtBrdrCol=150

UseKM Determines if the GoDB Converts Legend values greater than 10,000 to K and values greater than 10,000,000 to M.

Default is 1.
 UseKM

#chart1.UseKM=0 ' Do not transform Legend Numbers to K andM



Object Methods
MethodName Description GBasic Sample
SetData(FloatArray[XlegendArray,ColorArray,
Start,Count,
DisplayCount])

This method Set the Data points For the Chart.
The first Parameter is a Floating Point Array of Values for the Y Axis.
  
When Multiple Streams are Present then The array can be a 2D array.

if XHasValues is set to 1 then the Array is assumed to have X,Y As data Series.

Start and Count Parameters can be used for using a subset of the points in the
array for the chart.

NOTE:  This Method should be called after setting all the other properties. Like chart type etc.

SetData also Accepts String Arrays Generated by DB_RSArray. The String Array should
have two dimensions. The First Series will be used for X Legend Texts the second
seriesWill be converted to floats and used as Y values. The rest of the Data Series will be used as YValues for Other Chart Data Series or  as X Values based on XhasValues Property.

RowCount=DB_RSARRAY("select Brandname,rate from product",str$,1)
Chart1.SetData(str$,,,0,RowCount)

'************************************************
XlegendArray

For Time Series Graphs you can specify the Legend Text.

Note: The Size of the String array should match the items in the data points array.


Start and Count Parameters can be used for using a subset of the points in the
array for the chart.


'************************************************
ColorArray

This Property Sets the Colors for Data Points.

Start and Count Parameters can be used for using a subset of the points in the
array for the chart.

DisplayCount Parameter Determins the Number of point that will be displayed at a time.
A Scrollbar shows up if the total data items in the chart is more than the Display Count.

Note:
The Dimensions and the Size of the Color array should match the Data Points array.
For Pie charts the PtBrdrCol is used as a factor for Pie Shadow Color.


dimf a(10)
for i=0 to 9
a(i)=(i+100)*4
next

dims leg$(12)
leg$(0)="Jan"
leg$(1)="Feb"
....
leg$(11)="Dec"



dimi col(10)
col(0)=5000
col(1)=10000
....
col(9)=1000


#Chart1.SetData(a,leg$,col)


'Specifying Color
col(9)=PointCol
ChartType(ChartIDX,ChartType) Determines the Chart Type.

BAR_CHART  - 1
LINE_CHART  - 2
POINT_CHART  - 4 
PIE_CHART     - 8

These Values can be added to get Multiple charts.
Ex: (2+4)=6 will give a Line chart with Points.

To Generate a Horizontal Bar Chart, FlipXY attribute can be used.
  


#Chart1.ChartType(0,1)

' Draw Line Chart With Points
 #Chart1.ChartType(1,2+4)
   
  

ChartColor(ChartIDX,ChartType) This Method sets color for all the points charts in a Chart Series.
This can be overridden by the color specified for each point using SetColor Method.
 
#Chart1.ChartColor(0,63488)
#Chart1.ChartColor(1,63488)

Chart1.ChartColor(0,BGCol)
 

#Chart1.ChartColor(0,2016)
#Chart1.ChartColor(1,33823)
#Chart1.ChartColor(2,64512) 
  
ChartLabel(ChartIDX,String) This Method set the Legend Text for each Chart in a multi series graph. This Text Appears in the ChartLegend Window.
  

#Chart1.ChartLabel(0,"Company1")
#Chart1.ChartLabel(1,"Company2")
  

EventHandling: -

Events Supported   - CLICK , RCLICK

sub Chart1_click
print "Chart1_click"
print "ClickedX";#chart1.ClickedX
print "ClickedY";#chart1.ClickedY
print "ClickedSeries";#chart1.ClickedSeries
endsub

Samples:
 


dimf a(10)
for i=0 to 9
a(i)=(i+100)*4
next
#Chart1.SetData(a)

'*****************************
' Example with Start and Count
'*****************************
dimf a(100)
for i=0 to 10
a(i)=(i+100)*4
next
#Chart1.SetData(a,,,0,10)

'*****************************
' Example with two Streams
'*****************************
dimf a(2,10)
for i=0 to 9
a(0,i)=(i+100)*4
a(1,i)=(i+20)*12.56
next
#Chart1.SetData(a)

'*****************************
'XY Chart
'*****************************
dimf a(2,10)
for i=0 to 9
a(0,i)=(i+100)*4  ' X Data
a(1,i)=(i+20)*12.56 ' YData
next
#Chart1.XHasValues=1
#Chart1.SetData(a)

'*****************************
'Two XY Charts
'*****************************
dimf a(4,10)
dims leg$(100)
for i=0 to 9
a(0,i)=(i+100)*4
a(1,i)=(i+20)*12.56
a(2,i)=(i+100)*5
a(3,i)=(i+20)*16.56
next
#Chart1.XHasValues=1
#Chart1.SetData(a)


'*****************************
'Charts with Legend and Color
'*****************************
dimf a(1,10)
dims leg$(100)
dimi col(100)
tot=0
for i=0 to 9
a(0,i)=(i+10)*400
col(i)=(i+1)*1000
leg$(i)="Data"+(i)
next
#Chart1.SetData(a,leg$,col)

Notes: 

  

Style Sheets

Special Chars:
Special chars in attributes (say value) should be escaped with a %.
For Example,

% should be %25
> should be %3E
| should be %7C