SpreadJS Documentation
Configuring Gridlines
SpreadJS Documentation > Developer's Guide > Managing Data Visualization and Objects > Understanding Chart > Configuring Chart Elements > Configuring Gridlines

Gridlines refers to the horizontal and vertical lines appearing in the plot area of a chart.

In SpreadJS, the major GridLine and minor Gridline have same type. You can get or set the style of the gridLine, set their color, width and the visibility.

A basic image with configuration of major and minor gridlines for primary category axis and the primary value axis is shown below.

Using Code

This code shows how to configure major gridlines and minor gridlines in the chart for primary category axis and primary value axis.

JavaScript
Copy Code

//Configure chart gridlines
axes.primaryValue.majorGridLine.visible = true;
axes.primaryValue.majorGridLine.color = "Yellow";
axes.primaryValue.majorGridLine.width = 1;

axes.primaryValue.minorGridLine.visible = true;
axes.primaryValue.minorGridLine.color = "Orange";
axes.primaryValue.minorGridLine.width = 1;

axes.primaryCategory.majorGridLine.visible = true;
axes.primaryCategory.majorGridLine.color = "Green";
axes.primaryCategory.majorGridLine.width = 1;

axes.primaryCategory.minorGridLine.visible = true;
axes.primaryCategory.minorGridLine.color = "lightblue";
axes.primaryCategory.minorGridLine.width = 1;