Divisional Lines

Divisional Lines are the horizontal and vertical lines that run across the chart dividing the canvas in small segments. In this section we will discuss about the parameters to change the properties of Divisional Lines.
 
Horizontal Divisional Lines
We will go through the parameters that control the properties of Horizontal Divisional Lines first.
 
Number of Divisional Lines
numDivLines parameter determines the number of horizontal divisional lines to be displayed on the chart. FusionCharts Pro for FileMaker automatically tries to adjust divisional lines based on data provided. Take a look:
 
?v=3&chart=[chartType=Line2D;chartWidth=350;chartHeight=280]
&chartParams=[bgColor=FFFFFF;caption=Weekly Sales;numberPrefix=$;showAlternateHGridColor=0]
&labels=Week 1;Week 2;Week 3;Week 4
&data=40800;31400;26700;55400
 
By default, we get 4 horizontal divisional lines.
 
 
In the code below, we have specified the number of Divisional Lines as 6. Let's see how it works.
 
?v=3&chart=[chartType=Line2D;chartWidth=350;chartHeight=280]
&chartParams=[bgColor=FFFFFF;caption=Weekly Sales;numberPrefix=$;
numDivLines=6;showAlternateHGridColor=0]
&labels=Week 1;Week 2;Week 3;Week 4
&data=40800;31400;26700;55400
 
 
Divisional Line Color
We will be using divLineColor parameter here. This parameter specifies the color of the Divisional Lines. It accepts hexadecimal color code. Here is an example of FCQS with Blue divisional lines.
 
?v=3&chart=[chartType=Line2D;chartWidth=350;chartHeight=280] &chartParams=[bgColor=FFFFFF;caption=Weekly Sales;numberPrefix=$;
numDivLines=6;divLineColor=0000FF;showAlternateHGridColor=0]
&labels=Week 1;Week 2;Week 3;Week 4
&data=40800;31400;26700;55400
 
 
Divisional Line Thickness
The thickness of the Divisional Lines is determined by divLineThickness parameter. It accepts numeric value and set it as the thickness of the Divisional Lines in pixels.
 
?v=3&chart=[chartType=Line2D;chartWidth=350;chartHeight=280] &chartParams=[bgColor=FFFFFF;caption=Weekly Sales;numberPrefix=$;
numDivLines=6;divLineColor=0000FF;divLineThickness=4;showAlternateHGridColor=0]
&labels=Week 1;Week 2;Week 3;Week 4
&data=40800;31400;26700;55400
 
 
Show/Hide Divisional Line Values
To show or hide the values of the Divisional Lines we will use the parameter showDivLineValue. It is set as 1, i.e. 'show' by default.
 
?v=3&chart=[chartType=Line2D;chartWidth=350;chartHeight=280]
&chartParams=[bgColor=FFFFFF;caption=Weekly Sales;numberPrefix=$;
showDivLineValues=0;numDivLines=6;showAlternateHGridColor=0]
&labels=Week 1;Week 2;Week 3;Week 4
&data=40800;31400;26700;55400
 
 
Please note that the values across the Y-Axis are not displayed here. To revert the change, please set showDivLineValue=1 or just remove this parameter from the chartParams attribute.
 
Show/Hide Alternate Horizontal Grid Color
showAlternateHGridColor parameter fills alternate horizontal segments on the grid with colors thus creates a band effect on the canvas. The following example explains it.
 
?v=3&chart=[chartType=Line2D;chartWidth=350;chartHeight=280]
&chartParams=[bgColor=FFFFFF;caption=Weekly Sales;numberPrefix=$;
showDivLineValues=0;numDivLines=6;showAlternateHGridColor=1]
&labels=Week 1;Week 2;Week 3;Week 4
&data=40800;31400;26700;55400
 
 
To make it as before either set showAlternateHGridColor=0 or remove this parameter.
 
Alternate Horizontal Grid Color
alternateHGridColor defines the color to be used to fill the alternate grids. This parameter takes hexadecimal color code as its value. Let's take an example.
 
?v=3&chart=[chartType=Line2D;chartWidth=350;chartHeight=280]
&chartParams=[bgColor=FFFFFF;caption=Weekly Sales;numberPrefix=$;
showDivLineValues=0;numDivLines=6;showAlternateHGridColor=1;alternateHGridColor=9999CC]
&labels=Week 1;Week 2;Week 3;Week 4
&data=40800;31400;26700;55400
 
Let's see how simply we change the the alternate grid colors :
 
 
 
Vertical Divisional Lines
Now we will go through the parameters that influence the properties of Vertical Divisional Lines.
 
Number of Vertical Divisional Lines
numVDivLines specifies the number of Vertical Divisional Lines to be displayed. It accepts numeric value. Unlike Horizontal Divisional Lines, FusionCharts for FileMaker does not show any Vertical Divisional Lines by default. We have to specify it always. Let's take a simple example.
 
?v=3&chart=[chartType=Line2D;chartWidth=350;chartHeight=280]
&chartParams=[bgColor=FFFFFF;caption=Weekly Sales;numberPrefix=$;
numVDivLines=3;showAlternateHGridColor=0]
&labels=Week 1;Week 2;Week 3;Week 4
&data=40800;31400;26700;55400
 
 
Vertical Divisional Line Color
We will be using vDivLineColor parameter here. This parameter accepts hexadecimal color code as the color of the Vertical Divisional Lines. Below is an example.
 
?v=3&chart=[chartType=Line2D;chartWidth=350;chartHeight=280]
&chartParams=[bgColor=FFFFFF;caption=Weekly Sales;numberPrefix=$;
numVDivLines=3;vDivLineColor=0000FF;showAlternateHGridColor=0]
&labels=Week 1;Week 2;Week 3;Week 4
&data=40800;31400;26700;55400
 
 
Vertical Divisional Line Thickness
vDivLineThickness parameter sets the thickness of Vertical Divisional Lines. It accepts numeric value and assigns it as the thickness of vertical divisional lines (in pixels.)
 
?v=3&chart=[chartType=Line2D;chartWidth=350;chartHeight=280]
&chartParams=[bgColor=FFFFFF;caption=Weekly Sales;numberPrefix=$;
numVDivLines=3;vDivLineColor=0000FF;vDivLineThickness=4;showAlternateHGridColor=0]
&labels=Week 1;Week 2;Week 3;Week 4
&data=40800;31400;26700;55400
 
 
Show/Hide Alternate Vertical Grid Color
Parameter used for this purpose is showAlternateVGridColor. Value of this parameter can be either 0 or 1. This parameter is used to fill alternate grids with color. Let's test it with the example below.
 
?v=3&chart=[chartType=Line2D;chartWidth=350;chartHeight=280]
&chartParams=[bgColor=FFFFFF;caption=Weekly Sales;numberPrefix=$;
numVDivLines=3;showAlternateHGridColor=0;showAlternateVGridColor=1]
&labels=Week 1;Week 2;Week 3;Week 4
&data=40800;31400;26700;55400
 
 
Please note that first and third vertical grids are filled with color now. We will now see how to change alternate-grid color.
 
Alternate Vertical Grid Color
To change the color of alternate vertical grids, we have to set the value of alternateVGridColor with the desired hexadecimal color code. Here is an example.
 
?v=3&chart=[chartType=Line2D;chartWidth=350;chartHeight=280]
&chartParams=[bgColor=FFFFFF;caption=Weekly Sales;numberPrefix=$;
numVDivLines=3;showAlternateHGridColor=0;showAlternateVGridColor=1;alternateVGridColor=0000FF]
&labels=Week 1;Week 2;Week 3;Week 4
&data=40800;31400;26700;55400
 
 
Divisional Line Decimal Precision
Divisional Line Decimal Precision is specified through yAxisValueDecimals. This parameter can be used for all types of charts to regulate the decimal precision of Divisional line values.
 
In the example below we set the FCQS to show divisional lines' values with 1 decimal place.
 
?v=3&chart=[chartType=Line2D;chartWidth=350;chartHeight=220]
&chartParams=[caption=Weekly Sales;numberPrefix=$;numberSuffix=M;yAxisValueDecimals=1]
&labels=Week 1;Week 2;Week 3;Week 4&data=.40800;.31400;.26700;.55400
 
 
 
Special Divline parameter for combination charts
 
Show/Hide Secondary Divisional Line Values

showDivLineSecondaryValue allows us to show/hide the values of Secondary Divisional Lines, used in Combination Charts. As Combination Charts deal with Primary and Secondary Y-Axis, the Divisional Lines also have two values. showDivLinesSecondaryValue accepts 0/1 to hide/show the values.

Let's try with a simple example where we hide the values of the divisional lines from secondary axis.

 
?v=3&chart=[chartType=column3DLineDY;chartWidth=350;chartHeight=280]
&chartParams=[caption=Sales Comparison;xAxisName=Weeks;PYAxisName=Revenue;SYAxisName=Units Sold;
showDivLineSecondaryValue=0;showValues=0]
&labels=Week 1;Week 2;Week 3;Week 4
&data=[seriesName=Current Month;numberPrefix=$]40800;31400;26700;55400
&data=[seriesName=Previous Month;numberPrefix=$]38300;28400;15700;48100
&data=[SeriesName=Qunatity;parentYaxis=s]400;300;300;500
 
 
Now to show the values of Secondary Divisional Lines, we have to set showDivLineSecondaryValue=1 or just remove the parameter. Secondary Divisional Line Values are displayed by default.
 
?v=3&chart=[chartType=column3DLineDY;chartWidth=350;chartHeight=280]
&chartParams=[caption=Sales Comparison;xAxisName=Weeks;PYAxisName=Revenue;SYAxisName=Units Sold;
showDivLineSecondaryValue=1;showValues=0]
&labels=Week 1;Week 2;Week 3;Week 4
&data=[seriesName=Current Month;numberPrefix=$]40800;31400;26700;55400
&data=[seriesName=Previous Month;numberPrefix=$]38300;28400;15700;48100
&data=[SeriesName=Qunatity;parentYaxis=s]400;300;300;500
 
 
Please go to Common Parameters > Divline Properties section to get the list of Divline and Grid related parameters.