Available only in PRO Edition

Gage

API Reference

Overview

The Gage widget allows visualizing alteration of data values with the help of HSL-based color representation of the displayed value.

Initialization

Basic configuration for Gage initialization looks like this:

webix.ui({
    view: "gage",
    id: "gage1",
    value: 60,
    minRange: 0,
    maxRange: 100,
    label: "Speed",
    placeholder: "km/hour",
    smoothFlow: false
});

Related sample:  Gage Chart

Main Properties

  • value - (number) the initial value of the Gage widget. It should be set within the range of the minRange and maxRange parameters' values or equal to one of them.
  • minRange - (number) the maximum range value of the Gage scale. 0 by default
  • maxRange - (number) the maximum range value of the Gage scale. 100 by default
  • label - (string) the text label of a control
  • placeholder - (string) the text placeholder for the measurement unit of the Gage widget
  • smoothFlow - (boolean) defines whether the change of values in the Gage will flow with smooth animation. True by default
Back to top