Class RadialAxis

The RadialAxis is a circular arc in which a set of values are displayed along a linear or custom scale based on the design requirements.

Inheritance

System.Object

RadialAxis

Implements

Microsoft.Maui.IContentView

Microsoft.Maui.IView

Microsoft.Maui.IElement

Microsoft.Maui.ITransform

Microsoft.Maui.IPadding

Microsoft.Maui.ICrossPlatformLayout

Microsoft.Maui.IVisualTreeElement

Namespace: Syncfusion.Maui.Gauges

Assembly: Syncfusion.Maui.Gauges.dll

Syntax

public class RadialAxis : View, IContentView, IView, IElement, ITransform, IPadding, ICrossPlatformLayout, ITouchListener, IVisualTreeElement, IThemeElement

Examples

<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

AnimationDurationProperty

Identifies the AnimationDuration bindable property.

Declaration

public static readonly BindableProperty AnimationDurationProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for AnimationDuration bindable property.

AnnotationsProperty

Identifies the Annotations bindable property.

Declaration

public static readonly BindableProperty AnnotationsProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for Annotations bindable property.

AxisLabelStyleProperty

Identifies the AxisLabelStyle bindable property.

Declaration

public static readonly BindableProperty AxisLabelStyleProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for AxisLabelStyle bindable property.

AxisLineStyleProperty

Identifies the AxisLineStyle bindable property.

Declaration

public static readonly BindableProperty AxisLineStyleProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for AxisLineStyle bindable property.

BackgroundContentProperty

Identifies the BackgroundContent bindable property.

Declaration

public static readonly BindableProperty BackgroundContentProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for BackgroundContent bindable property.

CanRotateLabelsProperty

Identifies the CanRotateLabels bindable property.

Declaration

public static readonly BindableProperty CanRotateLabelsProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for CanRotateLabels bindable property.

CanScaleToFitProperty

Identifies the CanScaleToFit bindable property.

Declaration

public static readonly BindableProperty CanScaleToFitProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for CanScaleToFit bindable property.

EnableLoadingAnimationProperty

Identifies the EnableLoadingAnimation bindable property.

Declaration

public static readonly BindableProperty EnableLoadingAnimationProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for EnableLoadingAnimation bindable property.

EndAngleProperty

Identifies the EndAngle bindable property.

Declaration

public static readonly BindableProperty EndAngleProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for EndAngle bindable property.

IntervalProperty

Identifies the Interval bindable property.

Declaration

public static readonly BindableProperty IntervalProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for Interval bindable property.

IsInversedProperty

Identifies the IsInversed bindable property.

Declaration

public static readonly BindableProperty IsInversedProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for IsInversed bindable property.

LabelFormatProperty

Identifies the LabelFormat bindable property.

Declaration

public static readonly BindableProperty LabelFormatProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for LabelFormat bindable property.

LabelOffsetProperty

Identifies the LabelOffset bindable property.

Declaration

public static readonly BindableProperty LabelOffsetProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for LabelOffset bindable property.

LabelPositionProperty

Identifies the LabelPosition bindable property.

Declaration

public static readonly BindableProperty LabelPositionProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for LabelPosition bindable property.

MajorTickStyleProperty

Identifies the MajorTickStyle bindable property.

Declaration

public static readonly BindableProperty MajorTickStyleProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for MajorTickStyle bindable property.

MaximumLabelsCountProperty

Identifies the MaximumLabelsCount bindable property.

Declaration

public static readonly BindableProperty MaximumLabelsCountProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for MaximumLabelsCount bindable property.

MaximumProperty

Identifies the Maximum bindable property.

Declaration

public static readonly BindableProperty MaximumProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for Maximum bindable property.

MinimumProperty

Identifies the Minimum bindable property.

Declaration

public static readonly BindableProperty MinimumProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for Minimum bindable property.

MinorTicksPerIntervalProperty

Identifies the MinorTicksPerInterval bindable property.

Declaration

public static readonly BindableProperty MinorTicksPerIntervalProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for MinorTicksPerInterval bindable property.

MinorTickStyleProperty

Identifies the MinorTickStyle bindable property.

Declaration

public static readonly BindableProperty MinorTickStyleProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for MinorTickStyle bindable property.

OffsetUnitProperty

Identifies the OffsetUnit bindable property.

Declaration

public static readonly BindableProperty OffsetUnitProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for OffsetUnit bindable property.

PointersProperty

Identifies the Pointers bindable property.

Declaration

public static readonly BindableProperty PointersProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for Pointers bindable property.

RadiusFactorProperty

Identifies the RadiusFactor bindable property.

Declaration

public static readonly BindableProperty RadiusFactorProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for RadiusFactor bindable property.

RangesProperty

Identifies the Ranges bindable property.

Declaration

public static readonly BindableProperty RangesProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for Ranges bindable property.

ShowAxisLineProperty

Identifies the ShowAxisLine bindable property.

Declaration

public static readonly BindableProperty ShowAxisLineProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for ShowAxisLine bindable property.

ShowFirstLabelProperty

Identifies the ShowFirstLabel bindable property.

Declaration

public static readonly BindableProperty ShowFirstLabelProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for ShowFirstLabel bindable property.

ShowLabelsProperty

Identifies the ShowLabels bindable property.

Declaration

public static readonly BindableProperty ShowLabelsProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for ShowLabels bindable property.

ShowLastLabelProperty

Identifies the ShowLastLabel bindable property.

Declaration

public static readonly BindableProperty ShowLastLabelProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for ShowLastLabel bindable property.

ShowTicksProperty

Identifies the ShowTicks bindable property.

Declaration

public static readonly BindableProperty ShowTicksProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for ShowTicks bindable property.

StartAngleProperty

Identifies the StartAngle bindable property.

Declaration

public static readonly BindableProperty StartAngleProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for StartAngle bindable property.

TickOffsetProperty

Identifies the TickOffset bindable property.

Declaration

public static readonly BindableProperty TickOffsetProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for TickOffset bindable property.

TickPositionProperty

Identifies the TickPosition bindable property.

Declaration

public static readonly BindableProperty TickPositionProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for TickPosition bindable property.

UseRangeColorForAxisProperty

Identifies the UseRangeColorForAxis bindable property.

Declaration

public static readonly BindableProperty UseRangeColorForAxisProperty

Field Value

Type	Description
Microsoft.Maui.Controls.BindableProperty	The identifier for UseRangeColorForAxis bindable property.

Properties

AnimationDuration

Gets or sets a value that specifies the loading time animation duration in milliseconds.

Declaration

public double AnimationDuration { get; set; }

Property Value

Type	Description
System.Double	The default value is `1500` milliseconds.

Remarks

It specifies how long the loading time radial axis elements animation will take.

Examples

<gauge:SfRadialGauge >
       <gauge:SfRadialGauge.Axes>
           <gauge:RadialAxis EnableLoadingAnimation = "True" AnimationDuration="2000">

               <gauge:RadialAxis.Ranges>
                   <gauge:RadialRange EndValue = "50" Label="Range"/>
               </gauge:RadialAxis.Ranges>
               <gauge:RadialAxis.Pointers>
                   <gauge:RangePointer Value = "30" PointerOffset="30"/>
                   <gauge:NeedlePointer Value = "80" />
                   <gauge:ShapePointer Value = "60" />

                </gauge:RadialAxis.Pointers>
               <gauge:RadialAxis.Annotations>
                   <gauge:GaugeAnnotation DirectionValue = "90"
                                          DirectionUnit="Angle" 
                                          PositionFactor="0.5">
                       <gauge:GaugeAnnotation.Content>
                           <Label Text = "10" TextColor="Black"/>
                       </gauge:GaugeAnnotation.Content>
                   </gauge:GaugeAnnotation>
               </gauge:RadialAxis.Annotations>
           </gauge:RadialAxis>

       </gauge:SfRadialGauge.Axes>
   </gauge:SfRadialGauge>

Annotations

Gets or sets a collection of GaugeAnnotation to the axis.

Declaration

public ObservableCollection<GaugeAnnotation> Annotations { get; set; }

Property Value

Type	Description
System.Collections.ObjectModel.ObservableCollection<GaugeAnnotation>	The collection of GaugeAnnotation to display the specific point of interest in the radial gauge. The default value is empty collection.

Examples

The below examples shows, how to add a collection of annotation to the radial axis and customize each annotation by adding it to the annotation collection.

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis>
            <gauge:RadialAxis.Annotations>
                <gauge:GaugeAnnotation DirectionUnit="Angle"
                                       DirectionValue="90"
                                       PositionFactor="0.6">
                        <gauge:GaugeAnnotation.Content>
                                <Label Text="GaugeAnnotation"
                                           TextColor="Black" />
                        </gauge:GaugeAnnotation.Content>
                </gauge:GaugeAnnotation>
            </gauge:RadialAxis.Annotations>
        </gauge:RadialAxis>
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

AxisLabelStyle

Gets or sets GaugeLabelStyle, that used to customize gauge axis labels.

Declaration

public GaugeLabelStyle AxisLabelStyle { get; set; }

Property Value

Type
GaugeLabelStyle

Examples

       <gauge:SfRadialGauge>
           <gauge:SfRadialGauge.Axes>
               <gauge:RadialAxis>
                   <gauge:RadialAxis.AxisLabelStyle>
                       <gauge:GaugeLabelStyle FontSize="14" />
                   </gauge:RadialAxis.AxisLabelStyle>
               </gauge:RadialAxis>
           </gauge:SfRadialGauge.Axes>
       </gauge:SfRadialGauge>

AxisLineStyle

Gets or sets a value to customize the axis line.

Declaration

public RadialLineStyle AxisLineStyle { get; set; }

Property Value

Type
RadialLineStyle

Examples

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis>
            <gauge:RadialAxis.AxisLineStyle>
                <gauge:RadialLineStyle Fill="Red" CornerStyle="BothCurve"/>
            </gauge:RadialAxis.AxisLineStyle>
        </gauge:RadialAxis>
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

BackgroundContent

Gets or sets a image to set in axis background.

Declaration

public View BackgroundContent { get; set; }

Property Value

Type
Microsoft.Maui.Controls.View

Examples

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis RadiusFactor="1" StartAngle="0"
                             EndAngle="360"
                             ShowAxisLine="False"
                             CanRotateLabels="True"
                             TickOffset="0.32"
                             OffsetUnit="Factor"
                             LabelOffset="0.05"
                             Maximum="360"
                             Minimum="0"
                             Interval="30"
                             MinorTicksPerInterval="4">
               <gauge:RadialAxis.BackgroundContent>
                   <Image Source="axisbackground.png" />
               </gauge:RadialAxis.BackgroundContent>
               <gauge:RadialAxis.AxisLabelStyle>
                   <gauge:GaugeLabelStyle TextColor="White" />
               </gauge:RadialAxis.AxisLabelStyle>
               <gauge:RadialAxis.MajorTickStyle>
                   <gauge:RadialTickStyle LengthUnit="Factor" Length="0.087"/>
               </gauge:RadialAxis.MajorTickStyle>
               <gauge:RadialAxis.MinorTickStyle>
                   <gauge:RadialTickStyle LengthUnit= Factor" Length="0.058"/>
               </gauge:RadialAxis.MinorTickStyle>
           </gauge:RadialAxis>
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

BackgroundContentRadiusFactor

Gets or sets double value, that used to customize BackgroundContent radius. The default value is 1.

Declaration

protected double BackgroundContentRadiusFactor { get; set; }

Property Value

Type
System.Double

CanRotateLabels

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

Declaration

public bool CanRotateLabels { get; set; }

Property Value

Type	Description
System.Boolean	true if labels are rotated; otherwise, false. The default value is false.

Examples

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

CanScaleToFit

Gets or sets a value indicating whether to adjust the half or quarter gauge to fit the axis boundary. If CanScaleToFit true, the center and radius position of the axis will be modified on the basis of the angle value.

Declaration

public bool CanScaleToFit { get; set; }

Property Value

Type	Description
System.Boolean	true if CanScaleToFit is enabled; otherwise, false.The default value is true.

Examples

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

EnableLoadingAnimation

Gets or sets a value indicating whether to animate radial axis each elements in load time.

Declaration

public bool EnableLoadingAnimation { get; set; }

Property Value

Type	Description
System.Boolean	The default value is false.

Examples

<gauge:SfRadialGauge >
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis EnableLoadingAnimation = "True" AnimationDuration="2000">

            <gauge:RadialAxis.Ranges>
                <gauge:RadialRange EndValue = "50" Label="Range"/>
            </gauge:RadialAxis.Ranges>
            <gauge:RadialAxis.Pointers>
                <gauge:RangePointer Value = "30" PointerOffset="30"/>
                <gauge:NeedlePointer Value = "80" />
                <gauge:ShapePointer Value = "60" />

             </gauge:RadialAxis.Pointers>
            <gauge:RadialAxis.Annotations>
                <gauge:GaugeAnnotation DirectionValue = "90"
                                       DirectionUnit="Angle" 
                                       PositionFactor="0.5">
                    <gauge:GaugeAnnotation.Content>
                        <Label Text = "10" TextColor="Black"/>
                    </gauge:GaugeAnnotation.Content>
                </gauge:GaugeAnnotation>
            </gauge:RadialAxis.Annotations>
        </gauge:RadialAxis>

    </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	It defines the end angle of the axis. The default value is `50`.

Remarks

The picture below illustrates the direction of the angle from 0 degree to 360 degree.

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>

Interval

Gets or sets the interval value of the axis. Using this, the axis labels can be displayed after a certain interval value.

Declaration

public double Interval { get; set; }

Property Value

Type	Description
System.Double	It defines the interval of the RadialAxis. The default value is `double.NaN`.

Examples

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis Interval="10" />
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

IsInversed

Gets or sets a value indicating whether inverts the axis from right to left.

Declaration

public bool IsInversed { get; set; }

Property Value

Type	Description
System.Boolean	true if axis is inversed; otherwise, false.The default value is false.

Remarks

IsInversed decides whether the axis will be inversed or not. If IsInversed is true, the axis will be inversed, otherwise not inversed.

Examples

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

LabelFormat

Gets or sets a value to formats the axis labels with globalized string formats.

Declaration

public string LabelFormat { get; set; }

Property Value

Type	Description
System.String	The string that specifies the globalized string formats for the axis labels. Its default value is `string.Empty`.

Examples

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis LabelFormat="c" />
    </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	It defines the offset of the axis labels. The default value is `double.NaN`.

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>

LabelPosition

Gets or sets the value that indicates the position of the axis labels inside or outside the axis line.

Declaration

public GaugeLabelsPosition LabelPosition { get; set; }

Property Value

Type	Description
GaugeLabelsPosition	One of the enumeration values that specifies the position of labels in the radial gauge. The registered default is Inside.

Examples

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis LabelPosition="Outside" />
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

MajorTickStyle

Gets or sets RadialTickStyle, that used to customize major ticks.

Declaration

public RadialTickStyle MajorTickStyle { get; set; }

Property Value

Type
RadialTickStyle

Examples

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis>
            <gauge:RadialAxis.MajorTickStyle>
                <gauge:RadialTickStyle StrokeDashArray="2,2" />
            </gauge:RadialAxis.MajorTickStyle>
        </gauge:RadialAxis>
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

Maximum

Gets or sets the maximum value of the axis. The axis ends at this value.

Declaration

public double Maximum { get; set; }

Property Value

Type	Description
System.Double	It defines the maximum value of the RadialAxis. The default value is `100`.

Examples

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis Maximum="150" />
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

MaximumLabelsCount

Gets or sets the maximum number of labels to be displayed in an axis in 100 logical pixels.

Declaration

public int MaximumLabelsCount { get; set; }

Property Value

Type	Description
System.Int32	Maximum number of labels to be displayed in a axis in 100 logical pixels. Its default value is `3`.

Examples

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis MaximumLabelsCount="3" />
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

Minimum

Gets or sets the minimum value of the axis. The axis starts from this value.

Declaration

public double Minimum { get; set; }

Property Value

Type	Description
System.Double	It defines the minimum values of the RadialAxis. The default value is `0`.

Examples

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis Minimum="10" />
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

MinorTicksPerInterval

Gets or sets the interval of the minor ticks.

Declaration

public int MinorTicksPerInterval { get; set; }

Property Value

Type	Description
System.Int32	It defines number of minor ticks will be rendered between the major ticks. The default value is `1`.

Examples

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis MinorTicksPerInterval="5" />
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

MinorTickStyle

Gets or sets RadialTickStyle, that used to customize minor ticks.

Declaration

public RadialTickStyle MinorTickStyle { get; set; }

Property Value

Type
RadialTickStyle

Examples

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis>
            <gauge:RadialAxis.MinorTickStyle>
                <gauge:RadialTickStyle StrokeDashArray="2,2" />
            </gauge:RadialAxis.MinorTickStyle>
        </gauge:RadialAxis>
    </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	One of the SizeUnit enumeration that specifies how the LabelOffset and TickOffset values are considered. The default mode is Pixel.

Examples

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

Pointers

Gets or sets a collection of RadialPointer to the axis.

Declaration

public ObservableCollection<RadialPointer> Pointers { get; set; }

Property Value

Type	Description
System.Collections.ObjectModel.ObservableCollection<RadialPointer>	The collection of linear range to display the current value of the axis. The default value is empty collection.

Examples

The below examples shows, how to add a collection of gauge pointer to the radial axis and customize each pointer by adding it to the pointers collection.

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis>
            <gauge:RadialAxis.Pointers>
                <gauge:ShapePointer Value="50" />
                <gauge:NeedlePointer Value="60" />
                <gauge:RangePointer Value="70"/>
            </gauge:RadialAxis.Pointers>
        </gauge:RadialAxis>
    </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	It defines the radius factor of the axis. The default value is `0.8`.

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>

Ranges

Gets or sets a collection of RadialRange to the axis.

Declaration

public ObservableCollection<RadialRange> Ranges { get; set; }

Property Value

Type	Description
System.Collections.ObjectModel.ObservableCollection<RadialRange>	The collection of linear range to display the current value of the axis. The default value is empty collection.

Examples

The below examples shows, how to add a collection of gauge range to the radial axis and customize each range by adding it to the ranges collection.

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis>
            <gauge:RadialAxis.Ranges>
                <gauge:RadialRange StartValue="0" EndValue="35" Fill="Green" />
                <gauge:RadialRange StartValue="35" EndValue="70" Fill="Orange" />
                <gauge:RadialRange StartValue="70" EndValue="100" Fill="Red" />
            </gauge:RadialAxis.Ranges>
        </gauge:RadialAxis>
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

ShowAxisLine

Gets or sets a value indicating whether to shows or hides the axis line.

Declaration

public bool ShowAxisLine { get; set; }

Property Value

Type	Description
System.Boolean	true if axis line is displayed; otherwise, false.The default value is true.

Remarks

It decides whether the axis line will be rendered or not. If ShowAxisLine is true, the axis line will be rendered, otherwise not rendered.

Examples

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis ShowAxisLine="False" />
    </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	true if first label is displayed; otherwise, false. The default value is true.

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>

ShowLabels

Gets or sets a value indicating whether to shows or hides the axis labels.

Declaration

public bool ShowLabels { get; set; }

Property Value

Type	Description
System.Boolean	true if axis labels are displayed; otherwise, false.The default value is true.

Remarks

It decides whether the axis labels will be rendered or not. If ShowLabels is true, the axis labels will be rendered, otherwise not rendered.

Examples

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis ShowLabels="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	true if last label is displayed; otherwise, false. The default value is true.

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>

ShowTicks

Gets or sets a value indicating whether to shows or hides the axis tick lines.

Declaration

public bool ShowTicks { get; set; }

Property Value

Type	Description
System.Boolean	true if axis line ticks are displayed; otherwise, false.The default value is true.

Remarks

It decides whether the axis ticks will be rendered or not. If ShowTicks is true, the axis ticks will be rendered, otherwise not rendered.

Examples

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis ShowTicks="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	It defines the start angle of the axis. The default value is `130`.

Remarks

The picture below illustrates the direction of the angle from 0 degree to 360 degree.

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	It defines the offset of the ticks. The default value is `double.NaN`.

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>

TickPosition

Gets or sets the value that indicates the position of the ticks inside, center, or outside the axis line.

Declaration

public GaugeElementPosition TickPosition { get; set; }

Property Value

Type	Description
GaugeElementPosition	One of the enumeration values that specifies the position of ticks in the radial gauge. The default is Inside.

Examples

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis TickPosition="Outside" />
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

UseRangeColorForAxis

Gets or sets a value indicating whether to use the range color for axis elements such as labels and ticks.

Declaration

public bool UseRangeColorForAxis { get; set; }

Property Value

Type	Description
System.Boolean	true if use range color is enabled; otherwise, false.The default value is false.

Remarks

It decides whether the corresponding range color will be applied to the axis elements like labels and ticks or not. If UseRangeColorForAxis is true, the corresponding range colors will be applied, otherwise not.

Examples

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

Methods

ArrangeOverride(Rect)

Arrange the Axix view

Declaration

protected override Size ArrangeOverride(Rect bounds)

Parameters

Type	Name	Description
Microsoft.Maui.Graphics.Rect	bounds

Returns

Type
Microsoft.Maui.Graphics.Size

GenerateVisibleLabels()

Calculates the visible labels based on axis interval and range.

Declaration

protected virtual List<GaugeLabelInfo> GenerateVisibleLabels()

Returns

Type	Description
System.Collections.Generic.List<GaugeLabelInfo>	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
{
    protected override List<GaugeLabelInfo> GenerateVisibleLabels()
    {
        List<GaugeLabelInfo> customLabels = new List<GaugeLabelInfo>();
        for (int i = 0; i < 9; i++)
        {
            double value = CalculateLabelValue(i);
            GaugeLabelInfo label = new GaugeLabelInfo
            {
                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;
        }
    }
}

GetCenter(Double)

To calculate the center point and radius

Declaration

protected virtual Point GetCenter(double radius)

Parameters

Type	Name	Description
System.Double	radius	The radius

Returns

Type
Microsoft.Maui.Graphics.Point

MeasureOverride(Double, Double)

Method used to measure required size for axis.

Declaration

protected override Size MeasureOverride(double widthConstraint, double heightConstraint)

Parameters

Type	Name	Description
System.Double	widthConstraint	Available width.
System.Double	heightConstraint	Available height.

Returns

Type
Microsoft.Maui.Graphics.Size

OnBindingContextChanged()

Invoked whenever the binding context of the View changes.

Declaration

protected override void OnBindingContextChanged()

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.

ValueToFactor(Double)

Converts axis value to circular factor value.

Declaration

public virtual double ValueToFactor(double value)

Parameters

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

Returns

Type	Description
System.Double	Circular factor 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 ValueToFactor(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;
        }
    }
}

ValueToPoint(Double)

Converts axis value to vector point.

Declaration

public Point ValueToPoint(double value)

Parameters

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

Returns

Type	Description
Microsoft.Maui.Graphics.Point	Vector point of the provided value.

Events

LabelCreated

Called when an axis label is created

Declaration

public event EventHandler<LabelCreatedEventArgs> LabelCreated

Event Type

Type
System.EventHandler<LabelCreatedEventArgs>

Examples

XAML
C#

<gauge:SfRadialGauge>
    <gauge:SfRadialGauge.Axes>
        <gauge:RadialAxis LabelCreated="RadialAxis_LabelCreated" />
    </gauge:SfRadialGauge.Axes>
</gauge:SfRadialGauge>

private void RadialAxis_LabelCreated(object sender, LabelCreatedEventArgs e)
{
    e.Text += "%";
}

Implements

Microsoft.Maui.IContentView

Microsoft.Maui.IView

Microsoft.Maui.IElement

Microsoft.Maui.ITransform

Microsoft.Maui.IPadding

Microsoft.Maui.ICrossPlatformLayout

Microsoft.Maui.IVisualTreeElement