Demos
Documentation
API
More Samples
Download Wijmo

Ranges

Wijmo gauges are composed of Range objects. Range objects have "min" and "max" properties the define the extent of the range, as well as "thickness" and "color" properties that define the appearance of the range.

Every gauge has at least two ranges, the "face" and the "pointer":

  • face: Represents the gauge background. The "min" and "max" properties of the face range correspond to the "min" and "max" properties of the gauge, and limit the values that the gauge can display.
  • pointer: Indicates the gauge's current value. The "max" property of the pointer range corresponds to the "value" property of the gauge.

In addition to these two special ranges, gauges may have any number of additional ranges added to their "ranges" collection. These additional ranges can be used in two ways:

By default, extra ranges appear as part of the gauge background. This way you can show 'zones' within the gauge, like 'good', 'average', and 'bad' for example. If you set the gauge's "showRanges" property to false, the additional ranges are not shown. Instead, they are used to automatically set the color of the "pointer" range based on the current gauge value: