WjLinearGauge Class

The default value for this property is GaugeDirection.Right.

This property is useful for positioning custom SVG elements on the gauge.

Use this property if you want to customize the strings shown on the gauge in cases where the format property is not enough.

If provided, the callback should be a function as that takes as parameters the gauge, the part name, the value, and the formatted value. The callback should return the string to be displayed on the gauge.

For example:

// callback to convert values into strings
gauge.getText = (gauge, part, value, text) => {
    switch (part) {
        case 'value':
            if (value <= 10) return 'Empty!';
            if (value <= 25) return 'Low...';
            if (value <= 95) return 'Good';
            return 'Full';
        case 'min':
            return 'EMPTY';
        case 'max':
           return 'FULL';
    }
    return text;
}

The default value for this property is true.

The default value for this property is true.

The default value for this property is true.

Disabled controls cannot get mouse or keyboard events.

The default value for this property is true.

For details about using the min and max properties, please see the Using the min and max properties topic.

For details about using the min and max properties, please see the Using the min and max properties topic.

By default, this property is set to null, which causes the value range to start at the gauge's minimum value, or zero if the minimum is less than zero.

If this property is set to false, the ranges contained in the ranges property are not displayed in the gauge. Instead, they are used to interpolate the color of the pointer range while animating value changes.

The default value for this property is true.

The default value for this property is ShowText.All for RadialGauge controls, and to ShowText.None for LinearGauge controls.

You can use CSS to style the tickmark text:

.wj-gauge .wj-tick-text text {
    opacity: 1;
    font-family: Courier;
    font-size: 8pt;
    fill: purple;
}

See also the showTicks and tickSpacing properties.

The default value for this property is false.

The tickmarks can be formatted in CSS using the wj-gauge and wj-ticks class names. For example:

.wj-gauge .wj-ticks {
    stroke-width: 2px;
    stroke: white;
}

The default value for this property is **false.

By default, stackRanges is set to false, and the ranges in the ranges collection are displayed with the same thickness as the gauge's face.

Setting stackRanges to true causes the ranges to become narrower, and to be displayed side-by-side.

tabindex attribute value can be defined statically for a Wijmo control by specifying it on the control's host HTML element. But this value can't be changed later during application lifecycle, because Wijmo controls have complex structure, and the control may need to propagate this attribute value to its internal element to work properly.

Because of this, to read or change control's tabindex dynamically, you should do it using this property.

Setting the thickness to one causes the gauge to fill as much of the control area as possible. Smaller values create thinner gauges.

Set the showTicks property to true if you want the gauge to show tickmarks along its face. By default, the interval between tickmarks is defined by the step property.

Use the tickSpacing property to override the default and use a spacing that is different from the step value. Set the tickSpacing property to null to revert to the default behavior.