Skip to content

Grid Lines

Warning

Only bar and line charts can leverage grid lines.

You can specify solid or dotted grid lines on your chart using the chg parameter.

This parameter doesn't let you specify the thickness or color of the lines, if you need this please contact us with your requirements.

Syntax

chg=
  <x_axis_enabled>,<y_axis_enabled>,
  <opt_dash_length>,<opt_space_length>
  • <x_axis_enabled> if set to a number between 1 and 100 ([1;100]) enable vertical grid lines.
  • <y_axis_enabled> if set to a number between 1 and 100 ([1;100]) enable horizontal grid lines.

Info

Google Image charts use these two parameters to calculate how many x or y grid lines to show on the chart, we decided not to implement this feature as it was hard to use and error prone.

  • <opt_dash_length>, <opt_space_length> [Optional] Used to define dashed grid lines. The first parameter is the length of each line dash, in pixels. The second parameter is the spacing between dashes, in pixels. Specify 0 for for a solid line. Default values are 4,1.

Examples

These examples use only the <x_axis_step_size> and <y_axis_step_size> parameters. The Chart API displays a dashed grid line by default.

chart

cht=bvg
chg=20,50

chart

cht=lc
chg=20,50

The following example uses larger spaces to display lighter grid lines (1,5):

chart

chg=20,50,1,5

Finally let's hide the vertical grid lines from previous example:

chart

chg=0,50,1,5