ranges[]

An array of objects representing ranges contained in the range container.

Type:

Array

Default Value: []
Cannot be used in themes.

Ranges allow you to mark certain value ranges in the gauge. Visually, the ranges are displayed as bars along scales. To define ranges, introduce the ranges array. Specify a start value, an end value and a color for each range.

Show Example:
jQuery

This example shows how to divide the gauge range container into ranges and display these ranges in different colors.


                                    

                                    

color

Specifies a color of a range.

Type:

String

This option supports the following colors.

Show Example:
jQuery

In this example, all ranges are drawn in different colors.


                                    

                                    

endValue

Specifies an end value of a range.

Type:

Number

Show Example:
jQuery

In this example, the range container is divided into five ranges, each of which is defined by the startValue and endValue fields.


                                    

                                    

startValue

Specifies a start value of a range.

Type:

Number

Show Example:
jQuery

In this example, the range container is divided into five ranges each of which is defined by the startValue and endValue fields.