<gauge:SfRadialGauge>
   <gauge:SfRadialGauge.Axes>
       <gauge:RadialAxis RadiusFactor="0.85"
                         Interval="10"
                         FontSize="14"
                         Minimum="-60"
                         Maximum="60">

           <gauge:RadialAxis.Pointers>
               <gauge:NeedlePointer EnableAnimation="True"
                                    NeedleLengthUnit="Factor"
                                    NeedleLength="0.7"
                                    Value="9.94"
                                    NeedleStartWidth="2"
                                    NeedleEndWidth="10"
                                    KnobRadius="0.05"
                                    KnobSizeUnit="Factor"
                                    TailLength="0.1"
                                    TailWidth="10">
               </gauge:NeedlePointer>
           </gauge:RadialAxis.Pointers>
       </gauge:RadialAxis>
   </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

Constructors

RadialAxis()

Initializes a new instance of the RadialAxis class.

Declaration

public RadialAxis()

Examples

Create RadialAxis with the default or required scale range and customized axis properties.

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis StartAngle = "130"
                          EndAngle="50"
                          IsInversed="False"
                          RadiusFactor="0.9"
                          CanRotateLabels="False"
                          ShowLabels="True"
                          ShowAxisLine="True"
                          ShowTicks="True"
                          ShowFirstLabel="True"
                          ShowLastLabel="True"
                          Minimum="0"
                          Maximum="100"
                          Interval="10"
                          MinorTicksPerInterval="5"
                          ...
                          >
        </gauge:RadialAxis>
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

Fields

BackgroundContentProperty

Dependency registration for BackgroundContent

Declaration

public static readonly DependencyProperty BackgroundContentProperty

Field Value

Type	Description
Microsoft.UI.Xaml.DependencyProperty

CanRotateLabelsProperty

The dependency registration for CanRotateLabels"

Declaration

public static readonly DependencyProperty CanRotateLabelsProperty

Field Value

Type	Description
Microsoft.UI.Xaml.DependencyProperty

EndAngleProperty

The dependency registration for EndAngle"

Declaration

public static readonly DependencyProperty EndAngleProperty

Field Value

Type	Description
Microsoft.UI.Xaml.DependencyProperty

LabelOffsetProperty

Dependency registration for LabelOffset

Declaration

public static readonly DependencyProperty LabelOffsetProperty

Field Value

Type	Description
Microsoft.UI.Xaml.DependencyProperty

OffsetUnitProperty

Dependency registration for OffsetUnit

Declaration

public static readonly DependencyProperty OffsetUnitProperty

Field Value

Type	Description
Microsoft.UI.Xaml.DependencyProperty

RadiusFactorProperty

The dependency registration for RadiusFactor"

Declaration

public static readonly DependencyProperty RadiusFactorProperty

Field Value

Type	Description
Microsoft.UI.Xaml.DependencyProperty

ShowFirstLabelProperty

The dependency registration for ShowFirstLabel"

Declaration

public static readonly DependencyProperty ShowFirstLabelProperty

Field Value

Type	Description
Microsoft.UI.Xaml.DependencyProperty

ShowLastLabelProperty

The dependency registration for ShowLastLabel"

Declaration

public static readonly DependencyProperty ShowLastLabelProperty

Field Value

Type	Description
Microsoft.UI.Xaml.DependencyProperty

StartAngleProperty

The dependency registration for StartAngle"

Declaration

public static readonly DependencyProperty StartAngleProperty

Field Value

Type	Description
Microsoft.UI.Xaml.DependencyProperty

TickOffsetProperty

Dependency registration for TickOffset

Declaration

public static readonly DependencyProperty TickOffsetProperty

Field Value

Type	Description
Microsoft.UI.Xaml.DependencyProperty

Properties

BackgroundContent

Gets or sets the visual element to display in the background content such as Image or gradient content of radial axis boundary.

Declaration

public object BackgroundContent { get; set; }

Property Value

Type	Description
System.Object

Examples

The BackgroundContent applied for the RadialAxis boundary. Defaults value is null.

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis>
            <gauge:RadialAxis.BackgroundContent>        
                <Image Source="Assets/AxisBackground.png" />
            </gauge:RadialAxis.BackgroundContent>
        </gauge:RadialAxis>
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

CanRotateLabels

Gets or sets a value indicating whether to rotate the labels.

Declaration

public bool CanRotateLabels { get; set; }

Property Value

Type	Description
System.Boolean

Examples

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis CanRotateLabels="True" />
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

EndAngle

Gets or sets a value that specifies the EndAngle of axis.

Declaration

public double EndAngle { get; set; }

Property Value

Type	Description
System.Double

Examples

By setting the StartAngle, EndAngle and IsInversed, we can change the shape the radial gauge into full radial gauge, half radial gauge, and quarter radial gauge.

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis EndAngle="50" />
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

LabelOffset

Gets or sets a value to adjusts the axis label position from tick end. You can specify value either in logical pixel or radius factor using the OffsetUnit property.

Declaration

public double LabelOffset { get; set; }

Property Value

Type	Description
System.Double

Examples

If offsetUnit is GaugeSizeUnit.factor, value will be given from 0 to 1. Here labels placing position is calculated by LabelOffset * axis outer radius value. Example: labelOffset value is 0.2 and axis radius is 100, labels moving 20(0.2 * 100) logical pixels from axis line outer end. If offsetUnit is GaugeSizeUnit.logicalPixel, the defined value distance labels will move from the outer end of the axis.

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis LabelOffset="30" />
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

OffsetUnit

Gets or sets the value that indicates to calculate the labels and ticks offset either in logical pixel or factor.

Declaration

public SizeUnit OffsetUnit { get; set; }

Property Value

Type	Description
SizeUnit

Examples

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis OffsetUnit="Factor" />
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

RadiusFactor

Gets or sets a value that specifies the radius of the RadialAxis. This value ranges from 0 to 1.

Declaration

public double RadiusFactor { get; set; }

Property Value

Type	Description
System.Double

Examples

The size of the axis, expressed as the radius (half the diameter) in factor. The radiusFactor must be between 0 and 1. Axis radius is determined by multiplying this factor value to the minimum width or height of the control.

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis RadiusFactor="0.9" />
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

ShowFirstLabel

Gets or sets a value indicating whether shows or hides the first label of the axis

Declaration

public bool ShowFirstLabel { get; set; }

Property Value

Type	Description
System.Boolean

Examples

When startAngle and endAngle are the same, the first and last labels are intersected.To prevent this, enable this property to be false, if ShowLastLabel is true.

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis ShowFirstLabel="False" />
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

ShowLastLabel

Gets or sets a value indicating whether shows or hides the last label of the axis.

Declaration

public bool ShowLastLabel { get; set; }

Property Value

Type	Description
System.Boolean

Examples

When startAngle and endAngle are the same, the first and last labels are intersected.To prevent this, enable this property to be false, if ShowFirstLabel is true.

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis ShowLastLabel="False" />
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

StartAngle

Gets or sets a value that specifies the StartAngle of axis.

Declaration

public double StartAngle { get; set; }

Property Value

Type	Description
System.Double

Examples

By setting the StartAngle, EndAngle and IsInversed, we can change the shape the radial gauge into full radial gauge, half radial gauge, and quarter radial gauge.

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis StartAngle="130" />
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

TickOffset

Gets or sets the value to adjusts the axis ticks position from the axis lines. You can specify value either in logical pixel or radius factor using the OffsetUnit property.

Declaration

public double TickOffset { get; set; }

Property Value

Type	Description
System.Double

Examples

If offsetUnit is GaugeSizeUnit.factor, value will be given from 0 to 1. Here ticks placing position is calculated by TickOffset * axis outer radius value. Example: TickOffset value is 0.2 and axis radius is 100, ticks moving 20(0.2 * 100) logical pixels from axis line outer end. If offsetUnit is GaugeSizeUnit.logicalPixel, the defined value distance ticks will move from the outer end of the axis.

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis TickOffset="30" />
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

Methods

GenerateVisibleLabels()

Calculates the visible labels based on axis interval and range.

Declaration

public virtual List<AxisLabelData> GenerateVisibleLabels()

Returns

Type	Description
System.Collections.Generic.List<AxisLabelData>	The visible label collection.

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <local:RadialAxisExt Minimum = "0"
                             Maximum="150"
                             ShowTicks="False"
                             AxisLineWidthUnit="Factor"
                             AxisLineWidth="0.15">
        </local:RadialAxisExt>
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

public class RadialAxisExt : RadialAxis
{
    public override List<AxisLabelData> GenerateVisibleLabels()
    {
        List<AxisLabelData> customLabels = new List<AxisLabelData>();
        for (int i = 0; i < 9; i++)
        {
            double value = CalculateLabelValue(i);
            AxisLabelData label = new AxisLabelData
            {
                Value = value,
                Text = value.ToString()
            };
            customLabels.Add(label);
        }

        return customLabels;
    }

    double CalculateLabelValue(double value)
    {
        if (value == 0)
        {
            return 0;
        }
        else if (value == 1)
        {
            return 2;
        }
        else if (value == 2)
        {
            return 5;
        }
        else if (value == 3)
        {
            return 10;
        }
        else if (value == 4)
        {
            return 20;
        }
        else if (value == 5)
        {
            return 30;
        }
        else if (value == 6)
        {
            return 50;
        }
        else if (value == 7)
        {
            return 100;
        }
        else
        {
            return 150;
        }
    }
}

MeasureOverride(Size)

Measures the size in layout required for child elements.

Declaration

protected override Size MeasureOverride(Size availableSize)

Parameters

Type	Name	Description
Windows.Foundation.Size	availableSize	This size give to child elements.

Returns

Type	Description
Windows.Foundation.Size	Return child element size.

OnApplyTemplate()

Invoke to render RadialAxis class.

Declaration

protected override void OnApplyTemplate()

OnCreateAutomationPeer()

Declaration

protected override AutomationPeer OnCreateAutomationPeer()

Returns

Type	Description
Microsoft.UI.Xaml.Automation.Peers.AutomationPeer

ValueToAngle(Double)

Converts circular axis value to respective direction angle.

Declaration

public double ValueToAngle(double value)

Parameters

Type	Name	Description
System.Double	value	The value.

Returns

Type	Description
System.Double	Angle of the given value.

ValueToCoefficient(Double)

Converts axis value to circular coefficient value.

Declaration

public virtual double ValueToCoefficient(double value)

Parameters

Type	Name	Description
System.Double	value	The axis value to convert as coefficient.

Returns

Type	Description
System.Double	Circular coefficient of the provided value.

Examples

XAML
C#

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <local:RadialAxisExt Minimum = "0"
                             Maximum="150"
                             ShowTicks="False"
                             AxisLineWidthUnit="Factor"
                             AxisLineWidth="0.15">
            <gauge:RangePointer EnableAnimation = "True"
                                Value="60"
                                LengthSize="0.15"
                                SizeUnit="Factor">
                <gauge:RangePointer.GradientStops>
                    <gauge:GaugeGradientStop Value = "5"
                                             Color="#FF9E40DC" />
                    <gauge:GaugeGradientStop Value = "45"
                                             Color="#FFE63B86" />
                </gauge:RangePointer.GradientStops>
            </gauge:RangePointer>
        </local:RadialAxisExt>
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

public class RadialAxisExt : RadialAxis
{
    public override double ValueToCoefficient(double value)
    {
        if (value >= 0 && value <= 2)
        {
            return (value * 0.125) / 2;
        }
        else if (value > 2 && value <= 5)
        {
            return (((value - 2) * 0.125) / (5 - 2)) + (1 * 0.125);
        }
        else if (value > 5 && value <= 10)
        {
            return (((value - 5) * 0.125) / (10 - 5)) + (2 * 0.125);
        }
        else if (value > 10 && value <= 20)
        {
            return (((value - 10) * 0.125) / (20 - 10)) + (3 * 0.125);
        }
        else if (value > 20 && value <= 30)
        {
            return (((value - 20) * 0.125) / (30 - 20)) + (4 * 0.125);
        }
        else if (value > 30 && value <= 50)
        {
            return (((value - 30) * 0.125) / (50 - 30)) + (5 * 0.125);
        }
        else if (value > 50 && value <= 100)
        {
            return (((value - 50) * 0.125) / (100 - 50)) + (6 * 0.125);
        }
        else if (value > 100 && value <= 150)
        {
            return (((value - 100) * 0.125) / (150 - 100)) + (7 * 0.125);
        }
        else
        {
            return 1;
        }
    }
}

ValueToVector(Double)

Converts axis value to vector point.

Declaration

public Point ValueToVector(double value)

Parameters

Type	Name	Description
System.Double	value	The axis value to convert as vector.

Returns

Type	Description
Windows.Foundation.Point	Vector point of the provided value.

Events

AxisTapped

Called when an axis is tapped.

Declaration

public event EventHandler<AxisTappedEventArgs> AxisTapped

Event Type

Type	Description
System.EventHandler<AxisTappedEventArgs>

Remarks

You can get the tapped axis value from its AxisTappedEventArgs argument.

Examples

XAML
C#

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis AxisTapped="RadialAxis_AxisTapped"/>
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

The RadialAxis passes the tapped axis value as arguments.

private void RadialAxis_AxisTapped(object sender, AxisTappedEventArgs e)
{
    var value = e.Value;
}

WinUI- v19.1.0.63

Class RadialAxis

Inheritance

Inherited Members

Namespace: Syncfusion.UI.Xaml.Gauges

Assembly: Syncfusion.Gauge.WinUI.dll

Syntax

Examples

Constructors

RadialAxis()

Declaration

Examples

Fields

BackgroundContentProperty

Declaration

Field Value

CanRotateLabelsProperty

Declaration

Field Value

EndAngleProperty

Declaration

Field Value

LabelOffsetProperty

Declaration

Field Value

OffsetUnitProperty

Declaration

Field Value

RadiusFactorProperty

Declaration

Field Value

ShowFirstLabelProperty

Declaration

Field Value

ShowLastLabelProperty

Declaration

Field Value

StartAngleProperty

Declaration

Field Value

TickOffsetProperty

Declaration

Field Value

Properties

BackgroundContent

Declaration

Property Value

Examples

CanRotateLabels

Declaration

Property Value

Examples

EndAngle

Declaration

Property Value

Examples

LabelOffset

Declaration

Property Value

Examples

OffsetUnit

Declaration

Property Value

Examples

RadiusFactor

Declaration

Property Value

Examples

ShowFirstLabel

Declaration

Property Value

Examples

ShowLastLabel

Declaration

Property Value

Examples

StartAngle

Declaration

Property Value

Examples