Range Pointer is not in center of Scale

[John]

I was using version 17.3 then I updated to latest version. But now all the sfgauges I was using, got messed up. I have fixed them as much as possible but there is still a problem.

Before it used to be in center. Now its aligned outside and at the end has a bit offset too where a tiny amount of scale is visible. But the later is not really concern. I only want it to be in center.

Please check the attached image, before after. Before.png is what I want.

Thank you.

Attachment: Images_e8a72f11.zip

[Sridevi Sivakumar]

Hi John,

We would like to let you know that in our previous version 17.3, pointer placement in little bit outside of the rim. After 17.3 we have made some modification in our source. The range pointer render will be start from rim start position.

For your query will be resolved set the offset value greater than 1.

If set the value greater than 1, the pointer will be move to outside of the rim.

 

Pointer offset value	Pointer position
>1	Render start from outside of the rim.
=1	Render start from rim start position.
<1	Render start from inside of the rim.

Code snippet: 

    <gauge:SfCircularGauge > 

            <gauge:SfCircularGauge.Scales> 

                <gauge:CircularScale x:Name="scale" SweepAngle="270" RimStroke="LightGray" ShowLabels="False" ShowTicks="False" RimStrokeThickness="20"  RangePointerPosition="Custom"> 

                    <gauge:CircularScale.Pointers> 

                        <gauge:CircularPointer PointerType="RangePointer"  Offset="1.02" RangePointerStrokeThickness="30" RangePointerStroke="DeepSkyBlue" Value="75"/> 

                    </gauge:CircularScale.Pointers> 

                </gauge:CircularScale> 

            </gauge:SfCircularGauge.Scales> 

        </gauge:SfCircularGauge> 

Screenshot: 

 

Regards,
Sridevi S. 

 

 

[John]

<syncfusion:SfCircularGauge
                                    Margin="0,-18,0,0"
                                    Height="65"
                                    Width="100"
                                    HorizontalAlignment="Center">
            <syncfusion:SfCircularGauge.Scales>
                <syncfusion:CircularScale
                                          RangePointerPosition="Custom"                                           
                                          ShowTicks="False"
                                          ShowLabels="False"
                                          RimStroke="#FFBBBBBB"
                                          RimStrokeThickness="10"  
                                          StartAngle="180"
                                          SweepAngle="180">
                    <syncfusion:CircularScale.Pointers>
                        <syncfusion:CircularPointer
                                                    RangePointerStrokeThickness="16"
                                                    NeedlePointerVisibility="Collapsed"                                                    
                                                    PointerType="RangePointer"
                                                    Offset="1.02"
                                                    RangePointerStroke="#FFFF0000"
                                                      />
                    </syncfusion:CircularScale.Pointers>
                </syncfusion:CircularScale>
            </syncfusion:SfCircularGauge.Scales>
        </syncfusion:SfCircularGauge>

[John]

Tried that, still doesn't go in center.

[Sridevi Sivakumar]

Hi John,

We have analyzed your query with your code snippet, and we found that the Value property not set in CircularPointer. We can display the range pointer by setting the pointer value and customize the position of the range pointer by adjusting the pointer offset value as per the below code snippet.

Code snippet: [XAML] 

     <syncfusion:CircularPointer 

                                 RangePointerStrokeThickness="16" 

                                 NeedlePointerVisibility="Collapsed"                                 

                                 PointerType="RangePointer" 

                                 Offset="1.05"  Value="75" 

                                 RangePointerStroke="#FFFF0000" 

                                   /> 

Screenshot:


Please have a sample from the below link.
https://www.syncfusion.com/downloads/support/forum/160077/ze/GaugeSample-313070698

Let us know if you need any further assistance.

Regards,
Sridevi S. 

 

[John]

The sample works good when app runs but same code in my app doesn't. But the sample has same problem in design time in VS 2019. I think if you fix this for design time, I think it will get fixed on my app too.

Here is what it shows in design time, in VS 2019.

PS: Why its showing another gauge in background?

[Sridevi Sivakumar]

Hi John,

Query 1: Rim does not center on designer

We have checked the reported query, and you can adjust the Rim by changing the scale RadiusFactor value instead of Range pointer. RadiusFactor range is (0 to 1). Also, keep the RangePointer offset value to 1 to achieve your scenario.

Code snippet: 

        <syncfusion:SfCircularGauge 

                                    Margin="0,-18,0,0" 

                                    Height="65" 

                                    Width="100" 

                                    HorizontalAlignment="Center"> 

            <syncfusion:SfCircularGauge.Scales> 

                <syncfusion:CircularScale  RadiusFactor="0.94" 

                                          RangePointerPosition="Custom"                                           

                                          ShowTicks="False" 

                                          ShowLabels="False" 

                                          RimStroke="#FFBBBBBB" 

                                          RimStrokeThickness="10"   

                                          StartAngle="180" 

                                          SweepAngle="180"> 

                    <syncfusion:CircularScale.Pointers> 

                        <syncfusion:CircularPointer 

                                                    RangePointerStrokeThickness="16" 

                                                    NeedlePointerVisibility="Collapsed"                                                     

                                                    PointerType="RangePointer" 

                                                    Offset="1"  Value="75" 

                                                    RangePointerStroke="#FFFF0000" 

                                                      /> 

                    </syncfusion:CircularScale.Pointers> 

                </syncfusion:CircularScale> 

            </syncfusion:SfCircularGauge.Scales> 

        </syncfusion:SfCircularGauge> 

Query 2: Why its showing another gauge in background

We were able to reproduce the issue “Default scale is added wrongly in designer with application level scale” and we confirm this as a bug and logged a defect report. You can keep track of the bug from the feedback portal below.

Link: https://www.syncfusion.com/feedback/21350

The provided feedback link is private, and you need to login to view this feedback.

The fix will be included in our Volume 4, SP1 release, which is expected to be rolled out on end of January 2021.

If you have any more specification/precise replication procedure or a scenario to be tested, you can add it as a comment in the portal.

Regards,
Sridevi S. 

 

[Sridevi Sivakumar]

Hi John,

We are glad to announce that our Essential Studio 2020 Volume 4 service pack release v18.4.0.39  is rolled out and is available for download under the following link.

https://www.syncfusion.com/forums/161973/essential-studio-2020-volume-4-service-pack-release-v18-4-0-39-is-available-for-download

We thank you for your support and appreciate your patience in waiting for this release. Please get in touch with us if you would require any further assistance.

Regards,
Sridevi S.