Labels

  • 3 minutes to read

There are two types of labels supported in the ASPxGaugeControl:

  • Custom labels that can display only static text, and do not display a scale value automatically;
  • Scale value labels (supported only by circular and linear gauges) show current scale values and can also display custom text.

Custom Labels

All types of gauges support custom labels. Custom labels provide the following features.

  • They can be displayed above or below other gauge elements.

    To specify the label's position along the Z axis, use the label's ZOrder property.

  • Support for HTML formatting of the label's text.

    You can use specific HTML tags to format the label's text. See Label.Text to learn more.

To add a custom label to a web form at design time, do the following:

  • locate the Gauge control's smart tag and click Customize Gauge Control...;

    Labels-Invoke Customize Gauge tag

  • In the invoked Visual Gauge Control Designer, locate the gauge's smart tag menu and click Add Label;

    Invoke Add Label tag

A custom gauge label appears in the gauge designer and you can edit it.

For this, select the label on the gauge and invoke its designer via the label's smart tag as shown below.

Labels - Run label designer

Then, in the invoked designer, you can customize label appearance, geometry and text.

CustomLabelDesigner

Custom labels are represented by LabelComponent class objects.

When you add a custom label at design time, it's added to the gauge's BaseGaugeWin.Labels collection.

Scale Value Labels

Scale value labels are supported by circular and linear gauges. They allow a scale's value to be automatically displayed, and in addition, they can display custom text. The features of scale labels include:

  • The ability to display a scale's value along with custom text.

    Value labels belong to a scale and they automatically receive notifications when the scale's value is changed, and update view information accordingly. You do not need to write additional code to synchronize the value label and the scale's value.

  • Support for HTML formatting of the label's text.

    You can use specific HTML tags to format the label's text.

  • A scale label belongs to a scale, so it's displayed at the same level as the scale.

To add a scale value label at design time, you need to run the scale label collection editor. To accomplish this, do the following:

  • Run Visual Gauge Control Designer as you did in the previous section;
  • For the required scale, locate its smart tag and click Run Designer.

    Run Scale Designer

  • Then, in the invoked Scales - Element Designer, locate and click the Labels... button, as shown below.

    ClickScaleLabelEditor

The collection editor allows you to add one or more labels and customize their settings:

ValueLabel_CollectionEditor

For instance, the FormatString property allows you to include the scale's current value in the label's text. Note that placeholder {0} stands for the value of the label's Text property, and placeholder {1} stands for the scale's current value.

In the image below, the label belongs to the upper scale, so it shows a value of 25.

Scale label on web form

See Also