How to design various directional semi-circular gauge using WinUI Radial Gauge?

This article describes how to create the various directional semi-circular gauge using the WinUI Radial Gauge control.

You can create the semi-circular gauge by varying the StartAngle and EndAngle properties of the RadialAxis.

Create the SfRadialGauge control by referring to this getting started link and adding an axis to it.

East directional gauge: Set the start angle property value as 270 and the end angle property value as 90 to show the east direction semi-circular gauge.

XAML

<gauge:RadialAxis StartAngle="270"
                  EndAngle="90"
                  Interval="10" />

Output

West directional gauge: Set the start angle property value as 90, end angle property value as 270, and IsInversed property value as true to show the west directional semi-circular gauge.

XAML

<gauge:RadialAxis StartAngle="90"
                  EndAngle="270"
                  Interval="10"
                  IsInversed="True" />

Output

North directional gauge: Set the start angle property value as 180 and the end angle property value as 0 to show the north directional semi-circular gauge.

XAML

<gauge:RadialAxis StartAngle="180"
                  EndAngle="0"
                  Interval="10" />

Output

South directional gauge: Set the start angle property value as 0, end angle property value as 180, and IsInversed property value as true to show the south directional semi-circular gauge.

XAML

<gauge:RadialAxis StartAngle="0"
                  EndAngle="180"
                  Interval="10"
                  IsInversed="True" />

Output

View the sample on GitHub

See also

How to remove extra space around the axis when rendering a semi-circle gauge