Labels in SfLinearGauge

3 Sep 2020 / 14 minutes to read

LinearScale labels associate a numeric value with major scale tick marks.

Label color customization

The label color can be changed using the LabelColor property.

  • c#
  • SfLinearGauge linearGauge = new SfLinearGauge(this);
                linearGauge.SetBackgroundColor(Color.White);
                linearGauge.SetOrientation(SfLinearGauge.Orientation.Horizontal);
                LinearScale linearScale = new LinearScale();
                linearScale.ScaleBarColor = Color.ParseColor("#e0e0e0");
                linearScale.MajorTickSettings.StrokeWidth = 1;
                linearScale.MinorTickSettings.StrokeWidth = 1;
                linearScale.MajorTickSettings.Length = 20;
                linearScale.MajorTickSettings.Color = Color.Gray;
                linearScale.MinorTickSettings.Color = Color.Gray;
                linearScale.MinorTickSettings.Length = 10;
                linearScale.LabelColor = Color.Purple;
                linearGauge.Scales.Add(linearScale);

    Label color customization image

    Label font customization

    The label font can be customized by using the LabelFontSize and LabelFontStyle properties.

  • c#
  • SfLinearGauge linearGauge = new SfLinearGauge(this);
                linearGauge.SetBackgroundColor(Color.White);
                linearGauge.SetOrientation(SfLinearGauge.Orientation.Horizontal);
                LinearScale linearScale = new LinearScale();
                linearScale.LabelFontSize = 15;
                linearScale.ScaleBarColor = Color.ParseColor("#e0e0e0");
                linearScale.LabelFontStyle = Typeface.Create("Chiller", TypefaceStyle.Italic);
                linearScale.MajorTickSettings.StrokeWidth = 1;
                linearScale.MinorTickSettings.StrokeWidth = 1;
                linearScale.MajorTickSettings.Length = 20;
                linearScale.MajorTickSettings.Color = Color.Gray;
                linearScale.MinorTickSettings.Color = Color.Gray;
                linearScale.MinorTickSettings.Length = 10;
                linearScale.LabelColor = Color.ParseColor("#424242");
                linearGauge.Scales.Add(linearScale);

    Label-font-customization image

    Setting position for labels

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

  • c#
  • SfLinearGauge linearGauge = new SfLinearGauge(this);
                linearGauge.SetBackgroundColor(Color.White);
                linearGauge.SetOrientation(SfLinearGauge.Orientation.Horizontal);
                LinearScale linearScale = new LinearScale();
                linearScale.ScaleBarColor = Color.ParseColor("#e0e0e0");
                linearScale.MajorTickSettings.StrokeWidth = 1;
                linearScale.MinorTickSettings.StrokeWidth = 1;
                linearScale.MajorTickSettings.Length = 20;
                linearScale.MajorTickSettings.Color = Color.Gray;
                linearScale.MinorTickSettings.Color = Color.Gray;
                linearScale.MinorTickSettings.Length = 10;
                linearScale.LabelColor = Color.ParseColor("#424242");
                linearScale.LabelOffset = 5;
                linearGauge.Scales.Add(linearScale);

    Label-offset image

    Setting postfix and prefix for labels

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

    Setting label postfix

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

  • c#
  • SfLinearGauge linearGauge = new SfLinearGauge(this);
                linearGauge.SetBackgroundColor(Color.White);
                linearGauge.SetOrientation(SfLinearGauge.Orientation.Horizontal);
                LinearScale linearScale = new LinearScale();
                linearScale.Minimum = 0;
                linearScale.Maximum = 1000;
                linearScale.Interval = 200;
                linearScale.ScaleBarColor = Color.ParseColor("#e0e0e0");
                linearScale.MajorTickSettings.StrokeWidth = 1;
                linearScale.MinorTickSettings.StrokeWidth = 1;
                linearScale.MajorTickSettings.Length = 20;
                linearScale.MajorTickSettings.Color = Color.Gray;
                linearScale.MinorTickSettings.Color = Color.Gray;
                linearScale.MinorTickSettings.Length = 10;
                linearScale.LabelColor = Color.ParseColor("#424242");
                linearScale.LabelPostfix = "K";
                linearGauge.Scales.Add(linearScale);

    Label-postfix image

    Setting label prefix

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

  • c#
  • SfLinearGauge linearGauge = new SfLinearGauge(this);
                linearGauge.SetBackgroundColor(Color.White);
                linearGauge.SetOrientation(SfLinearGauge.Orientation.Horizontal);
                LinearScale linearScale = new LinearScale();
                linearScale.ScaleBarColor = Color.ParseColor("#e0e0e0");
                linearScale.LabelColor = Color.ParseColor("#424242");
                linearScale.LabelPrefix = "$";
                linearScale.MajorTickSettings.StrokeWidth = 1;
                linearScale.MinorTickSettings.StrokeWidth = 1;
                linearScale.MajorTickSettings.Length = 20;
                linearScale.MajorTickSettings.Color = Color.Gray;
                linearScale.MinorTickSettings.Color = Color.Gray;
                linearScale.MinorTickSettings.Length = 10;
                linearGauge.Scales.Add(linearScale);

    Label-prefix image

    Labels visibility

    Labels visibility can be customized using the ShowLabels property of linear scale.

  • c#
  • SfLinearGauge linearGauge = new SfLinearGauge(this);
                linearGauge.SetBackgroundColor(Color.White);
                linearGauge.SetOrientation(SfLinearGauge.Orientation.Horizontal);
                LinearScale linearScale = new LinearScale();
                linearScale.ScaleBarSize = 40;
                linearScale.ScaleBarColor = Color.ParseColor("#e0e0e0");
                linearScale.MajorTickSettings.Color = Color.Black;
                linearScale.MinorTickSettings.Color = Color.Black;
                linearScale.MajorTickSettings.Length = 40;
                linearScale.MinorTickSettings.Offset = -20;
                linearScale.MajorTickSettings.Offset = -40;
                linearScale.MajorTickSettings.StrokeWidth = 1;
                linearScale.MinorTickSettings.StrokeWidth = 1;
                linearScale.MinorTickSettings.Length = 20;
                linearScale.MinorTicksPerInterval = 4;
                linearScale.ShowLabels = false;
                linearGauge.Scales.Add(linearScale);

    Labels visibility image

    Customize the scale labels

    The scale label are customized by using LabelFormat and Culture properties of linear scale.

    LabelFormat property is used to change the format of labels by setting a formatting string on the LabelFormat property.
    Culture property is used to format the group separator of the value based on the respective culture.

  • c#
  • SfLinearGauge linearGauge = new SfLinearGauge(this);
                ObservableCollection<LinearScale> scales = new ObservableCollection<LinearScale>();
                LinearScale linearScale = new LinearScale();
                linearScale.MaximumLabels = 4;
                linearScale.ScaleOffset = 50;
                linearScale.Minimum = 10;
                linearScale.Maximum = 50;
                linearScale.Interval = 10;
                linearScale.ScaleBarColor = Color.LightGray;
                linearScale.MinorTicksPerInterval = 1;
                linearScale.LabelFontSize = 15;
                linearScale.LabelFormat = "{0:c}";
                linearScale.LabelOffset = 10;
                linearScale.ScaleBarSize = 10;
                linearScale.LabelColor = Color.Black;
                BarPointer barPointer = new BarPointer();
                barPointer.Value = 35;
                barPointer.Color = Color.Red;
                barPointer.StrokeWidth = 10;
                linearScale.Pointers.Add(barPointer);
                LinearRange linearRange = new LinearRange();
                linearRange.StartValue = 0;
                linearRange.EndValue = 60;
                linearRange.Color = Color.Blue;
                linearRange.Offset = -25;
                linearRange.StartWidth = 10;
                linearRange.EndWidth = 10;
                linearScale.Ranges.Add(linearRange);
                linearScale.Culture = new System.Globalization.CultureInfo("fr-FR");
                scales.Add(linearScale);
                linearGauge.Scales = scales;
                SetContentView(linearGauge);

    Label format Image