By default, the C1RadialGauge control displays only a blue-gray background and a pointer. In most applications, you'll also want to display a scale composed of labels and tick marks that allow users to see what the current value is and where it lies within the gauge's range. This is done by adding C1GaugeMark, C1GaugeLabel, and C1GaugeRange elements to the gauge's Decorators collection:

The decorators are displayed at specific positions on the scale, determined by the value of the C1GaugeDecorator.From, C1GaugeDecorator.To, and C1GaugeMark.Interval properties.

In the image above, you'll see one C1GaugeMark and one C1GaugeLabel element:

<!-- Add label marks -->
<c1:C1GaugeLabel From="0" To="100" Interval="20" Location="1.1"/>

<!-- Add tick marks -->
<c1:C1GaugeMark From="0" To="100" Interval="5" Location=".9"/>

The C1GaugeLabel element shows labels for the values 0 to 100 along the scale. The C1GaugeMark element shows tick marks spaced 5 units apart.

In addition to showing the scale, you may want to highlight parts of the scale range. For example, you may want to add a red marker to indicate that values in that range are too low (sales) or too high (expenses). This can be done easily by adding one or more C1GaugeRange elements to the gauge's C1Gauge.Decorators collection.

In the image above, you'll see three C1GaugeRange elements:

<!-- Add three colored ranges -->

<c1:C1GaugeRange From="80" To="100" Location="0.7" Fill="Red" />

<c1:C1GaugeRange From="50" To="80" Location="0.7" Fill="Yellow" />

<c1:C1GaugeRange From="0" To="50" Location="0.7" Fill="Green" />

The C1GaugeRange elements show red, yellow, and green range areas. Each C1GaugeRange element displays a curved swath along the scale. The color of the swath is determined by the C1GaugeRange.Fill property, and the position is determined by the C1GaugeDecorator.From and C1GaugeDecorator.To properties. You can control the thickness of the ranges using the C1GaugeRange.StrokeThickness property.