minorGrid

Configures the minor grid.

Type: Object

In addition to the major grid built on major ticks, the Chart widget provides the minor grid built on minor ticks.

DevExtreme HTML5 Charts MinorGridLines

NOTE: Neither minor ticks, nor the minor grid can be displayed if the axis is of the "discrete" type.

The commonAxisSettings | minorGrid object specifies common settings for all minor grid lines in the chart. To configure only those grid lines that descend from a particular axis, use the following objects.

Axis-specific settings override common settings.

NOTE: Displaying the minor grid without the major grid may impair the readability of a chart. To prevent this situation, we recommend you use the minor grid only in conjunction with the major grid.

Show Example:
AngularJS
Knockout
jQuery

In this example, click the check box under the chart to show/hide the minor grid.


                                    

                                    

In this example, click the check box under the chart to show/hide the minor grid.


                                    

                                    

In this example, click the check box under the chart to show/hide the minor grid.


                                    

                                    

color

Specifies a color for the lines of the minor grid.

Type: String
Default Value: '#d3d3d3'

This option supports the following colors.

opacity

Specifies how transparent the lines of the minor grid should be.

Type: Number
Default Value: undefined

This option accepts a value from 0 to 1, where 0 makes the lines of the minor grid completely transparent, and 1 makes them opaque.

visible

Makes the minor grid visible.

Type: Boolean
Default Value: false

width

Specifies a width for the lines of the minor grid in pixels.

Type: Number
Default Value: 1