label

Specifies the options of the labels that accompany gauge bars.

Type:

Object

Each gauge bar is accompanied by a label that usually displays the value of the bar. Use the options of the label object to customize the label's text, specify its format, font, and distance between the label and the bar.

To hide labels, use the label.visible option or assign false straight to the label option.

View Demo

Show Example:
jQuery

In this example, several options of the labels are changed.


                                    

                                    

connectorColor

Specifies a color for the label connector text.

Type:

String

Default Value: undefined

This option supports the following colors.

Show Example:
jQuery

In this example, label connectors are colored in 'darkseagreen' using the connectorColor option.


                                    

                                    

connectorWidth

Specifies the width of the label connector in pixels.

Type:

Number

Default Value: 2

Show Example:
jQuery

In this example, the width of the label connectors is set to 1 pixel using the connectorWidth option.


                                    

                                    

customizeText

Specifies a callback function that returns a text for labels.

Type:

function

Function parameters:
barValue:

Object

Information on the bar value.

Object structure:
value:

Number

The raw value.

valueText:

String

The formatted value converted to a string.

Return Value:

String

The text for the label to display.

Cannot be used in themes.

When implementing a callback function for this option, you can use the value indicated by a bar. This value can be accessed using the fields of the object that is passed as the function's parameter. Alternatively, you can use the this object within the function. This object has the same structure as the object passed as a parameter.

To discover text customization in greater detail, refer to the Customize Text topic.

Show Example:
jQuery

In this example, bar labels are customized using the customizeText option.


                                    

                                    

font

Specifies font options for bar labels.

Type:

Object

Show Example:
jQuery

In this example, several font options of bar labels are changed.


                                    

                                    

format

Formats a value before it is displayed in a label. Accepts only numeric formats.

Type:

Format

Default Value: undefined

See the format section for details on accepted values.

See Also
Show Example:
jQuery

In this example, bars are accompanied by labels formatted in the 'fixedPoint' format with a precision of 2.


                                    

                                    

indent

Specifies the distance between the upper bar and bar labels in pixels.

Type:

Number

Default Value: 20

Show Example:
jQuery

In this example, the indent option is set to 5.


                                    

                                    

precision

Deprecated

Use the label.format.precision option instead.

Specifies a precision for the formatted value displayed by labels.

Type:

Number

Default Value: undefined

visible

Specifies whether bar labels appear on a gauge or not.

Type:

Boolean

Default Value: true

Show Example:
jQuery

Use the check box under the gauge to show/hide the bar labels.