# PlotBand Annotation Types

In this article the properties of the **PlotBandAnnotations** are described depending on the type of axis the annotation is associated with - cartesian, polar or radial.

## PlotBand Annotation Properties

The common properties for all PlotBandAnnotations are:

* **Fill**: Gets or sets the Brush that specifies how the shape's interior is painted.
* **StrokeDashArray**: Gets or sets a collection of double values that indicates the pattern of dashes and gaps that is used to outline stroked annotation.
* **Stroke**: Gets or sets the Brush that specifies how the shape outline is painted.
* **StrokeThickness**: Gets or sets the width of the shape stroke outline.

### CartesianPlotBandAnnotation Specific Properties

* **Axis**: The cartesian plotband annotation needs to be associated with the horizontal or vertical axis explicitly.

* **From** (of type object): The starting value for the plotband.
  > When the axis is numerical (Linear or Logarithmic) a numeric value is expected, and when it is a CategoricalAxis - a category is expected.

* **To** (of type object): The ending value for the plotband.
  > When the axis is numerical (Linear or Logarithmic) a numeric value is expected, and when it is a CategoricalAxis - a category is expected.

* **Label** (string): The string that defines the label of the annotation. By default it is null.

* **[LabelDefinition](https://www.telerik.com/winui/documentation/controls/radchart/annotations/chart-labels)** (ChartAnnotationLabelDefinition): Defines the position of the annotation label. Check the [Annotation Labels](https://www.telerik.com/winui/documentation/controls/radchart/annotations/chart-labels) topic for more details.

### PolarAxisPlotBandAnnotation Specific Properties

* **From** (of type double): The starting point for the plotband.
* **To** (of type double): The ending point for the plotband.

### RadialAxisPlotBandAnnotation Specific Properties

* **From** (of type object): The starting point for the plotband.
  > When the radial axis is a NumericalRadialAxis a numeric value is expected, and when it is a CategoricalRadialAxis - a category.

* **To** (of type object): the ending point for the plotband.
  > When the radial axis is a NumericalRadialAxis a numeric value is expected, and when it is a CategoricalRadialAxis - a category.

## Example of CartesianPlotBandAnnotations

**CartesianPlotbandAnnotation** can be either a horizontal or a vertical stripe that crosses the whole chart and marks a value range on the associate axis. **Example 1** demonstrates how to define both a horizontal and vertical **CartesianPlotBandAnnotation** in a **RadCartesianChart**.

#### **Example 1: CartesianPlotbandAnnotation**

```XAML
<Grid xmlns:telerikChart="using:Telerik.UI.Xaml.Controls.Chart"
	xmlns:telerikCharting="using:Telerik.Charting">
	<telerikChart:RadCartesianChart Width="400" Height="300">
		<telerikChart:RadCartesianChart.Annotations>
			<telerikChart:CartesianPlotBandAnnotation Axis="{Binding ElementName=horizontalAxis}" 
													From="1.8" To="2.8" 
													Stroke="LightGreen" StrokeThickness="1" Fill="#2090EE90"/>
			<telerikChart:CartesianPlotBandAnnotation Axis="{Binding ElementName=verticalAxis}" 
													From="3" To="5" 
													Stroke="Tomato" StrokeThickness="1" Fill="#20FF6347"/>
		</telerikChart:RadCartesianChart.Annotations>
		<telerikChart:RadCartesianChart.HorizontalAxis>
			<telerikChart:LinearAxis x:Name="horizontalAxis"/>
		</telerikChart:RadCartesianChart.HorizontalAxis>
		<telerikChart:RadCartesianChart.VerticalAxis>
			<telerikChart:LinearAxis x:Name="verticalAxis"/>
		</telerikChart:RadCartesianChart.VerticalAxis>
		<telerikChart:ScatterPointSeries>
			<telerikChart:ScatterPointSeries.DataPoints>
				<telerikCharting:ScatterDataPoint XValue="1" YValue="1" />
				<telerikCharting:ScatterDataPoint XValue="5" YValue="3" />
				<telerikCharting:ScatterDataPoint XValue="8" YValue="11" />
			</telerikChart:ScatterPointSeries.DataPoints>
		</telerikChart:ScatterPointSeries>
		<telerikChart:RadCartesianChart.Grid>
			<telerikChart:CartesianChartGrid MajorGridLinesVisibility="XY" />
		</telerikChart:RadCartesianChart.Grid>
	</telerikChart:RadCartesianChart>
</Grid>
```

#### **Figure 1: RadCartesianChart with vertical and horizontal CartesianPlotBandAnnotations**

![WinUI RadChart Cartesian Plot Band Annotation](https://www.telerik.com/winui/documentation/assets/004ea46211a63aed20351080f7a26f6f/cartesianplotbandannotation.png)

## Example of PolarAxisPlotBandAnnotation

**PolarAxisPlotBandAnnotation** is represented by concentric stripe that mark a specific value (radius) range on the polar axis. **Example 2** demonstrates how to define **PolarAxisPlotBandAnnotation** in a **RadPolarChart**.

#### **Example 2: PolarAxisPlotBandAnnotation**

```XAML
<Grid xmlns:telerikChart="using:Telerik.UI.Xaml.Controls.Chart"
	  xmlns:telerikCharting="using:Telerik.Charting">
	<telerikChart:RadPolarChart Height="350">
		<telerikChart:RadPolarChart.Annotations>
		<telerikChart:PolarAxisPlotBandAnnotation From="2.8" To="4.8" Stroke="Tomato" Fill="#20FF6347"/>
		<telerikChart:PolarAxisPlotBandAnnotation From="7" To="9.5" Stroke="LightGreen" Fill="#2090EE90"/>
	</telerikChart:RadPolarChart.Annotations>
	<telerikChart:RadPolarChart.RadialAxis>
		<telerikChart:NumericalRadialAxis/>
	</telerikChart:RadPolarChart.RadialAxis>
	<telerikChart:RadPolarChart.PolarAxis>
		<telerikChart:PolarAxis/>
	</telerikChart:RadPolarChart.PolarAxis>
	<telerikChart:PolarPointSeries>
		<telerikChart:PolarPointSeries.DataPoints>
			<telerikCharting:PolarDataPoint Value="1" Angle="15" />
			<telerikCharting:PolarDataPoint Value="5" Angle="200" />
			<telerikCharting:PolarDataPoint Value="11" Angle="300" />
		</telerikChart:PolarPointSeries.DataPoints>
	</telerikChart:PolarPointSeries>
		<telerikChart:RadPolarChart.Grid>
			<telerikChart:PolarChartGrid GridLineVisibility="Both" />
		</telerikChart:RadPolarChart.Grid>
	</telerikChart:RadPolarChart>
</Grid>
```

#### **Figure 2: RadPolarChart with several PolarAxisPlotBandAnnotation**

![WinUI RadChart Polar Axis Plot Band Annotation](https://www.telerik.com/winui/documentation/assets/0361ef953939152750f540a1880eb6fc/polaraxisplotbandannotation.png)

## Example of RadialAxisPlotBandAnnotation

**RadialAxisPlotBandAnnotation** is represented by a sector of the circle (pie slice) that marks specific angular/categorical range. **Example 3** demonstrates how to define a **RadialAxisPlotBandAnnotation** in a **RadPolarChart**.

#### **Example 3: RadialAxisPlotBandAnnotation**

```XAML
<Grid xmlns:telerikChart="using:Telerik.UI.Xaml.Controls.Chart"
	  xmlns:telerikCharting="using:Telerik.Charting">
	<telerikChart:RadPolarChart Height="350">
		<telerikChart:RadPolarChart.Annotations>
			<telerikChart:RadialAxisPlotBandAnnotation From="10" To="50"  Stroke="LightGreen" StrokeThickness="1" Fill="#2090EE90"/>
			<telerikChart:RadialAxisPlotBandAnnotation From="120" To="160"  Stroke="Tomato" StrokeThickness="1" Fill="#20FF6347"/>
		</telerikChart:RadPolarChart.Annotations>
		<telerikChart:RadPolarChart.RadialAxis>
			<telerikChart:NumericalRadialAxis/>
		</telerikChart:RadPolarChart.RadialAxis>
		<telerikChart:RadPolarChart.PolarAxis>
			<telerikChart:PolarAxis/>
		</telerikChart:RadPolarChart.PolarAxis>
		<telerikChart:PolarPointSeries>
			<telerikChart:PolarPointSeries.DataPoints>
				<telerikCharting:PolarDataPoint Value="1" Angle="15" />
				<telerikCharting:PolarDataPoint Value="5" Angle="200" />
				<telerikCharting:PolarDataPoint Value="11" Angle="300" />
			</telerikChart:PolarPointSeries.DataPoints>
		</telerikChart:PolarPointSeries>
		<telerikChart:RadPolarChart.Grid>
			<telerikChart:PolarChartGrid GridLineVisibility="Both" />
		</telerikChart:RadPolarChart.Grid>
	</telerikChart:RadPolarChart>
</Grid>
```

#### **Figure 3: RadPolarChart with several RadialAxisPlotBandAnnotations**

![WinUI RadChart Radial Axis Plot Band Annotation](https://www.telerik.com/winui/documentation/assets/d23c905514d6ddebfce82ec28efedb80/radialaxisplotbandannotation.png)

## See Also

* [Overview](https://www.telerik.com/winui/documentation/controls/radchart/annotations/chart-overview)
* [GridLine Annotation Types](https://www.telerik.com/winui/documentation/controls/radchart/annotations/chart-gridline-types)
* [Custom Annotation Types](https://www.telerik.com/winui/documentation/controls/radchart/annotations/chart-custom-types)
* [Annotation Labels](https://www.telerik.com/winui/documentation/controls/radchart/annotations/chart-labels)
