Labels in SfCircularGauge

3 Sep 20209 minutes to read

The CircularScale labels associate a numeric value with major scale tick marks.

Label color customization

The label color can be changed using the LabelColor property.

C#

SfCircularGauge circularGauge = new SfCircularGauge(this);
            ObservableCollection<CircularScale> scales = new ObservableCollection<CircularScale>();
            CircularScale scale = new CircularScale();
            scale.StartValue = 0;
            scale.EndValue = 100;
            scale.LabelColor = Color.Blue;
            scales.Add(scale);
            circularGauge.CircularScales = scales;

Label font customization

The label font can be customized by using the LabelTextSize, LabelTextStyle properties.

C#

SfCircularGauge circularGauge = new SfCircularGauge(this);
            ObservableCollection<CircularScale> scales = new ObservableCollection<CircularScale>();
            CircularScale scale = new CircularScale();
            scale.StartValue = 0;
            scale.EndValue = 100;
            scale.LabelTextStyle = Typeface.Create("calibri", TypefaceStyle.Italic);
            scale.LabelTextSize = 20;
            scales.Add(scale);
            circularGauge.CircularScales = scales;

Setting position for labels

The labels can be positioned far away from the ticks by using the LabelOffset property.

C#

SfCircularGauge circularGauge = new SfCircularGauge(this);
            ObservableCollection<CircularScale> scales = new ObservableCollection<CircularScale>();
            CircularScale scale = new CircularScale();
            scale.StartValue = 0;
            scale.EndValue = 100;
            scale.LabelOffset = 0.4;
            scales.Add(scale);
            circularGauge.CircularScales = scales;

Setting number of decimal digits for labels

The NumberOfDecimalDigits property is used to set the number of decimal digits to be displayed in the scale labels.

C#

SfCircularGauge circularGauge = new SfCircularGauge(this);
            ObservableCollection<CircularScale> scales = new ObservableCollection<CircularScale>();
            CircularScale scale = new CircularScale();
            scale.StartValue = 0;
            scale.EndValue = 100;
            scale.NumberOfDecimalDigits = 3;
            scales.Add(scale);
            circularGauge.CircularScales = scales;

Setting postfix and prefix for labels

You can postfix/prefix values to the scale labels by using the LabelPostfix and LabelPrefix properties, respectively.

Label postfix

LabelPostfix property allows you to postfix the values to the scale labels.

C#

SfCircularGauge circularGauge = new SfCircularGauge(this);
            ObservableCollection<CircularScale> scales = new ObservableCollection<CircularScale>();
            CircularScale scale = new CircularScale();
            scale.StartValue = 0;
            scale.EndValue = 100;
            scale.LabelPostfix = "$";
            scales.Add(scale);
            circularGauge.CircularScales = scales;

Label prefix

LabelPrefix property allows you to prefix the values to the scale labels.

C#

SfCircularGauge circularGauge = new SfCircularGauge(this);
            ObservableCollection<CircularScale> scales = new ObservableCollection<CircularScale>();
            CircularScale scale = new CircularScale();
            scale.StartValue = 0;
            scale.EndValue = 100;
            scale.LabelPrefix = "$";
            scales.Add(scale);
            circularGauge.CircularScales = scales;

Edge label customization

You can customize the edge label by using the ShowFirstLabel and ShowLastLabel properties, which are Boolean properties. The ShowFirstLabel property is used to enable or disable first label, and the ShowLastLabel property is used to enable or disable the last label in circular gauge.

C#

SfCircularGauge circularGauge = new SfCircularGauge(this);
            ObservableCollection<CircularScale> scales = new ObservableCollection<CircularScale>();
            CircularScale scale = new CircularScale();
            scale.StartValue = 0;
            scale.Interval = 1;
            scale.MinorTicksPerInterval = 5;
            scale.EndValue = 12;
            scale.StartAngle = 270;
            scale.SweepAngle = 360;
            scale.ShowFirstLabel = false;
            scales.Add(scale);
            circularGauge.CircularScales = scales;

Show labels

The ShowLabels property is a Boolean property, which is used to enable or disable the labels in circular gauge.

C#

SfCircularGauge circularGauge = new SfCircularGauge(this);
            ObservableCollection<CircularScale> scales = new ObservableCollection<CircularScale>();
            CircularScale scale = new CircularScale();
            scale.StartValue = 0;
            scale.EndValue = 100;
            scale.ShowLabels = false;
            scales.Add(scale);
            circularGauge.CircularScales = scales;

Setting auto angle for label

Scale labels can be rotated automatically based on the current angle. To enable or disable the auto angle, use the EnableAutoAngle property.

C#

SfCircularGauge circularGauge = new SfCircularGauge(this);
            ObservableCollection<CircularScale> scales = new ObservableCollection<CircularScale>();
            CircularScale scale = new CircularScale();
            scale.StartValue = 0;
            scale.EndValue = 100;
            scale.EnableAutoAngle = true;
            scales.Add(scale);
            circularGauge.CircularScales = scales;