This is a migrated thread and some comments may be shown as answers.

How do I set needle thickness in a SemicircleGauge

1 Answer 69 Views
Gauge
This is a migrated thread and some comments may be shown as answers.
Håkan
Top achievements
Rank 1
Håkan asked on 21 Nov 2014, 01:57 PM
Hi,

I have a RadSemicircleNorthGauge where I want to have a thicker needle.
I use a tooltip and it is very hard to make it display when the needle is just one pixels wide.

Here is my XAML:
<telerik:RadSemicircleNorthGauge OuterBorderBrush="Transparent" OuterBackground="Transparent" InnerBorderBrush="Transparent" InnerBackground="Transparent" Foreground="{StaticResource TextBrush}" Margin="0,0,0,5">
                    <telerik:SemicircleNorthScale Center="0.5,1" Radius="0.9" MajorTickStep="20" Foreground="{StaticResource TextBrush}" FontSize="9" StartAngle="190" SweepAngle="160">
                        <telerik:SemicircleNorthScale.Indicators>
                            <telerik:Needle Name="Needle" Background="{StaticResource SelectedBrush}" IsAnimated="True" Duration="00:00:00.5" TooltipFormat=" {Value|F1} %" />
                            <telerik:BarIndicator x:Name="BarIndicator" Background="{StaticResource ShiftAbsenceBrush}" Value="{Binding Value, ElementName=Needle}" />
                            <telerik:Pinpoint Background="{StaticResource SelectedBrush}" BorderBrush="{StaticResource SelectedBrush}" />
                        </telerik:SemicircleNorthScale.Indicators>
                    </telerik:SemicircleNorthScale>
                </telerik:RadSemicircleNorthGauge>


Regards,
Håkan

1 Answer, 1 is accepted

Sort by
0
Accepted
Sia
Telerik team
answered on 24 Nov 2014, 04:15 PM
Hello,

You can use the ScaleObject.RelativeWidth property to specify the width of the needle relatively to the scale. For example:
<telerik:Needle Name="Needle" Background="Black" IsAnimated="True" Duration="00:00:00.5" TooltipFormat=" {Value|F1} %" telerik:ScaleObject.RelativeWidth ="0.05*" />

You can also set an integer value, which will be applied:
<telerik:Needle Name="Needle" Background="Black" IsAnimated="True" Duration="00:00:00.5" TooltipFormat=" {Value|F1} %" telerik:ScaleObject.RelativeWidth ="5" />

This property accepts XAML notation which is similar to the one that is used for the RowDefinition.Height property. For example:
  1. telerik:ScaleObject.RelativeWidth=”5” sets needle's width to be 5 pixels.
  2. telerik:ScaleObject.RelativeWidth=”0.05*” sets needle's width to be 0.05% of the scale relative width.

I hope this helps.

Regards,
Sia
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
Gauge
Asked by
Håkan
Top achievements
Rank 1
Answers by
Sia
Telerik team
Share this question
or