Synchronizing Y2-Axis Major Grid Lines With Y-Axis Major Grid Lines

How to:

By default, when there is a y-axis and a y2-axis, each generates its own major grid lines. The number of scale labels for each axis depends on the range of its individual data values. If you want to force the y2-axis to use the same number of scale labels as the y-axis, set the y2-axis majorGrid:lockToY1 property to true. The y2-axis will then share the y-axis major grid lines.

Top of page
x
Syntax: How to Synchronize the Y-Axis and Y2-Axis Major Grid Lines
y2axis:{
majorGrid: 
  {
  lockToY1: boolean    
  }
     }

where:

lockToY1: boolean

Controls whether the y2-axis will be drawn with the same number of scale labels as the y-axis so that they can share the same major grid lines. Valid values are:

  • false, which does not make the number of scale labels the same for the y-axis and y2-axis. This is the default value.
  • true, which makes the number of scale labels for the y2-axis the same as the number for the y-axis, and causes them to share the y-axis major grid lines.
Example: Using the Same Major Grid Lines for the Y-Axis and Y2-Axis

The following request generates a vertical line chart with a y-axis and a y2-axis. It does not specify that they should be drawn to use the number of scale labels:

GRAPH FILE WFLITE
SUM COGS_US DISCOUNT_US
BY PRODUCT_CATEGORY
ON GRAPH HOLD FORMAT JSCHART
ON GRAPH SET LOOKGRAPH VLINE
ON GRAPH SET AUTOFIT ON
ON GRAPH SET STYLE *
*GRAPH_JS
series: [{series:1, yAxisAssignment:2}],
yaxis: {
majorGrid: {visible:true}
},
y2axis: { 
majorGrid: {visible:true},
}
*END
ENDSTYLE
END

The output is shown in the following image. The y-axis has seven major grid lines, and the y2-axis has eight:

The following version of the request specifies true for the lockToY1 property of the y2-axis majorGrid object:

GRAPH FILE WFLITE
SUM COGS_US DISCOUNT_US
BY PRODUCT_CATEGORY
ON GRAPH HOLD FORMAT JSCHART
ON GRAPH SET LOOKGRAPH VLINE
ON GRAPH SET AUTOFIT ON
ON GRAPH SET STYLE *
*GRAPH_JS
series: [{series:1, yAxisAssignment:2}],
yaxis: {
majorGrid: {visible:true}
},
y2axis: { 
majorGrid: {
visible:true,
  lockToY1: true    
}
}
*END
ENDSTYLE
END

The output is shown in the following image. The y2-axis has been adjusted to use the same number of labels as the y-axis. Both axes are drawn to share the seven original y-axis major grid lines:

Information Builders