Tick Setting
3 Sep 20207 minutes to read
The TickSetting
property helps you to identify the gauge’s data value by marking the gauge scale in regular increments.
Show ticks for scale
The ShowTicks
property allows you to enable or disable the ticks of circular gauge.
SfCircularGauge circularGauge = new SfCircularGauge(this);
ObservableCollection<CircularScale> scales = new ObservableCollection<CircularScale>();
CircularScale scale = new CircularScale();
scale.StartValue = 0;
scale.EndValue = 100;
scale.ShowTicks = false;
circularGauge.CircularScales.Add(scale);
Ticks customization
The Interval
property is used to calculate the tick counts for a scale. Similar to ticks, minor ticks are calculated by using the MinorTicksPerInterval
property.
Color and thickness of the tick are set by using the Color
and Width
UI properties. You can also customize the length of the ticks by using the Size
property. First, you should set the Offset
property for ticks, then increase the size of the ticks.
Customize major ticks for scale
SfCircularGauge circularGauge = new SfCircularGauge(this);
ObservableCollection<CircularScale> scales = new ObservableCollection<CircularScale>();
CircularScale scale = new CircularScale();
scale.StartValue = 0;
scale.EndValue = 100;
TickSetting majorTicks = new TickSetting();
majorTicks.Size = 15;
majorTicks.Color = Color.Brown;
majorTicks.Width = 4;
majorTicks.Offset = 0.97;
scale.MajorTickSettings = majorTicks;
circularGauge.CircularScales.Add(scale);
Customize minor ticks for scale
SfCircularGauge circularGauge = new SfCircularGauge(this);
ObservableCollection<CircularScale> scales = new ObservableCollection<CircularScale>();
CircularScale scale = new CircularScale();
scale.StartValue = 0;
scale.EndValue = 100;
TickSetting minorTicks = new TickSetting();
minorTicks.Size = 4;
minorTicks.Color = Color.SkyBlue;
minorTicks.Width = 4;
minorTicks.Offset = 0.97;
scale.MinorTickSettings = minorTicks;
circularGauge.CircularScales.Add(scale);
Setting position for ticks
The major and minor ticks can be positioned far away from the rim by using the following two ways:
1.Offset
property.
2.StartOffset
and EndOffset
properties.
Setting offset for scale
SfCircularGauge circularGauge = new SfCircularGauge(this);
ObservableCollection<CircularScale> scales = new ObservableCollection<CircularScale>();
CircularScale scale = new CircularScale();
scale.StartValue = 0;
scale.EndValue = 100;
TickSetting majorTicks = new TickSetting();
majorTicks.Offset = 0.5;
scale.MajorTickSettings = majorTicks;
TickSetting minorTicks = new TickSetting();
minorTicks.Offset = 0.5;
scale.MinorTickSettings = minorTicks;
circularGauge.CircularScales.Add(scale);
Setting scale start and end offset for scale
SfCircularGauge circularGauge = new SfCircularGauge(this);
ObservableCollection<CircularScale> scales = new ObservableCollection<CircularScale>();
CircularScale scale = new CircularScale();
scale.StartValue = 0;
scale.EndValue = 100;
TickSetting majorTicks = new TickSetting();
majorTicks.StartOffset = 0.3;
majorTicks.EndOffset = 0.4;
scale.MajorTickSettings = majorTicks;
TickSetting minorTicks = new TickSetting();
minorTicks.StartOffset = 0.3;
minorTicks.EndOffset = 0.35;
scale.MinorTickSettings = minorTicks;
circularGauge.CircularScales.Add(scale);