Vue CircularGauge - rangeContainer.ranges

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

Selector: DxRange

Type:

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.

View Demo

color

Specifies a color of a range.

Type:

String

This property supports the following colors:

Hexadecimal colors
RGB colors
RGBA colors
Predefined/cross-browser color names
Predefined SVG colors
Paint server address

endValue

Specifies an end value of a range.

Selector: end-value

Type:

Number

startValue

Specifies a start value of a range.

Selector: start-value

Type:

Number

Was this topic helpful?

Thank you!

Feel free to share topic-related thoughts here.
If you have technical questions, please create a support ticket in the DevExpress Support Center.

Thank you for the feedback!