We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

A few circular gauge customization questions - pointers, labels, etc

Thread ID:





121300 Nov 29,2015 05:27 PM UTC Dec 1,2015 09:13 AM UTC Xamarin.Forms 4
Tags: SfCircularGauge
Derrick Willer
Asked On November 29, 2015 05:27 PM UTC

I'm trying to draw a circular gauge with a thick rim.  Ideally I'd only like the pointer to be visible when it overlaps the rim (instead of a straight line from the center of the gauge to the outside of the rim). Is this possible?  Needlepointer doesn't seem to support this.  The other thing that could work would be a rangepointer that didn't connect back to the left side of the gauge.

Also, is there any way to get the labels to display on the outer edge of the rim?  LabelOffset appears to move them from the inner edge of the rim (1.0) to the center point (0.0), but values over 1.0 cause the labels not to display at all.

Finally, the tick marks seems to stick out from the rim (and don't touch the inner part). Is there a way to make them completely line up?  They are set to the same thickness right now.

Derrick Willer
Replied On November 29, 2015 09:05 PM UTC

FYI I've been able to resolve some of this by using a Range to color the background instead of a thick rim.

The two remaining problems I have are:
1. LabelFontSize has no effect
2. Even with a LabelOffset of 0, long values are displayed overlapping the chart.  I'd love to have the label text rotated so it was tangent to the chart, but if that doesn't work, some way to make sure the label was completely outside of the chart as well would be great.

Nijamudeen Mohamed Sulaiman [Syncfusion]
Replied On November 30, 2015 08:47 AM UTC

Hi Derrick,

Thanks for your interest in Syncfusion Products.

Query #1

NeedlePointer Support:
We have “LengthFactor” support to increase the length of the needle pointer. Please find the code example below.


            rangePointer = new RangePointer();



Query #2
Placing Labels outside of Rim:

Based on your provided information, your requirement can be achieved by setting negative values to Scales LabelOffset property of CircularGauge.

            scale.LabelOffset = -0.5;


Query #3:

Ticks position can be adjusted by using Ticks (Major and Minor Ticks) Offset properties (Values can be adjusted by platform specific tweaks of xamarin). Please find the code example below:


            TickSettings minor = new TickSettings();

            minor.Offset = 0.5;

            scale.MinorTickSettings = minor;

            TickSettings major = new TickSettings();

            major.Offset = 1;

            scale.MajorTickSettings = major;

Query #4:

We have fixed the LabelFontSize issue in CircularGauge Xamarin (Android). This issue fix will be included in our upcoming Vol3 Service pack 2 release which is expected by first week of December. We will update you once the implementation has been rolled out. We appreciate your patience until then.

Query #5:

 Long values are displayed overlapping the chart:

Based on your provided information, your requirement can be achieved by setting “NumberOfDecimalDigits property of CircularGauge Scale. Please find the code example below.


            scale.NumberOfDecimalDigits = 1;

If the provided information doesn`t meet your requirement could you please provide more information along with sample with its replication procedure (Mention Xamarin mobile Platform)? It will be very helpful for us to analyse on it and provide you the possible solution.

Please let us know, if you need any further assistance on this.

Nijamudeen M.

Derrick Willer
Replied On November 30, 2015 05:13 PM UTC

#1 this makes the end of the needle (away from the center) longer.  Instead I want the needle not connected to the center point at all.  I've hacked this in by setting the knob color to the background color and giving it a huge radius.

#2 negative values make the labels appear on the wrong side of the center point. I'd need to set the value higher than 1 to move it further away from the center and I can't do that.

#3 ok.  Is there an exact value to use to make them always line up with a range?

#4 ok

#5 setting number of digits isn't possible.  The values I'm displaying are sometimes something like "1.2345" and sometimes "0.00005" and sometimes "12".  If I could set the total number of digits (as opposed to just decimals) this would help somewhat, but I still need to display at least 5 digits and have them not overlap the chart.   

Nijamudeen Mohamed Sulaiman [Syncfusion]
Replied On December 1, 2015 09:13 AM UTC

Hi Derrick,

We have created a separate incidents for this query, please login to below location to have follow up regarding this query.


Please let us know if you have any concern.

Nijamudeen M.


This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon