Class SfPolarChart

Renders polar line and area charts for data representation and enhanced user interface visualization.

Inheritance

System.Object

ChartBase

SfPolarChart

Implements

System.IDisposable

Inherited Members

ChartBase.LegendProperty

ChartBase.VisibleSeriesProperty

ChartBase.HeaderProperty

ChartBase.HorizontalHeaderAlignmentProperty

ChartBase.VerticalHeaderAlignmentProperty

ChartBase.TooltipBehaviorProperty

ChartBase.SuspendSeriesNotification()

ChartBase.ResumeSeriesNotification()

ChartBase.Dispose()

ChartBase.MeasureOverride(Size)

ChartBase.OnLostFocus(RoutedEventArgs)

ChartBase.OnGotFocus(RoutedEventArgs)

ChartBase.OnPointerCaptureLost(PointerRoutedEventArgs)

ChartBase.OnTapped(TappedRoutedEventArgs)

ChartBase.OnRightTapped(RightTappedRoutedEventArgs)

ChartBase.OnPointerWheelChanged(PointerRoutedEventArgs)

ChartBase.OnPointerExited(PointerRoutedEventArgs)

ChartBase.OnPointerEntered(PointerRoutedEventArgs)

ChartBase.OnPointerCanceled(PointerRoutedEventArgs)

ChartBase.OnKeyUp(KeyRoutedEventArgs)

ChartBase.OnKeyDown(KeyRoutedEventArgs)

ChartBase.OnHolding(HoldingRoutedEventArgs)

ChartBase.OnManipulationStarting(ManipulationStartingRoutedEventArgs)

ChartBase.OnManipulationStarted(ManipulationStartedRoutedEventArgs)

ChartBase.OnManipulationInertiaStarting(ManipulationInertiaStartingRoutedEventArgs)

ChartBase.OnManipulationCompleted(ManipulationCompletedRoutedEventArgs)

ChartBase.OnManipulationDelta(ManipulationDeltaRoutedEventArgs)

ChartBase.OnPointerPressed(PointerRoutedEventArgs)

ChartBase.OnPointerMoved(PointerRoutedEventArgs)

ChartBase.OnPointerReleased(PointerRoutedEventArgs)

ChartBase.OnDoubleTapped(DoubleTappedRoutedEventArgs)

ChartBase.Legend

ChartBase.TooltipBehavior

ChartBase.Header

ChartBase.HorizontalHeaderAlignment

ChartBase.VerticalHeaderAlignment

ChartBase.SeriesBoundsChanged

Namespace: Syncfusion.UI.Xaml.Charts

Assembly: Syncfusion.Chart.WinUI.dll

Syntax

public class SfPolarChart : ChartBase, IDisposable

Remarks

Polar chart control is used to visualize the data in terms of values and angles.

SfPolarChart class properties provides an option to add the series collection, allows to customize the chart elements such as legend, data label, and tooltip features.

Series

ChartSeries is the visual representation of data. SfPolarChart offers PolarAreaSeries and PolarLineSeries.

To render a series, create an instance of required series class, and add it to the Series collection.

 
<chart:SfPolarChart>

       <chart:SfPolarChart.DataContext>
           <local:ViewModel/>
       </chart:SfPolarChart.DataContext>

       <chart:PolarAreaSeries ItemsSource = "{Binding Data}" XBindingPath="XValue" YBindingPath="YValue"/>
</chart:SfPolarChart>

SfPolarChart chart = new SfPolarChart();

ViewModel viewModel = new ViewModel();
chart.DataContext = viewModel;

PolarAreaSeries series = new PolarAreaSeries()
{
    ItemsSource = viewmodel.Data,
    XBindingPath = "XValue",
    YBindingPath = "YValue"
};
chart.Series.Add(series);

public ObservableCollection<Model> Data { get; set; }

public ViewModel()
{
   Data = new ObservableCollection<Model>();
   Data.Add(new Model() { XValue = "A", YValue = 100 });
   Data.Add(new Model() { XValue = "B", YValue = 150 });
   Data.Add(new Model() { XValue = "C", YValue = 110 });
   Data.Add(new Model() { XValue = "D", YValue = 230 });
}

Legend

The Legend contains list of data points in chart series. The information provided in each legend item helps to identify the corresponding data point in chart series. The Series XBindingPath property value will be displayed in the associated legend item.

To render a legend, create an instance of ChartLegend, and assign it to the Legend property.

MainPage.xaml
MainPage.xaml.cs

 
<chart:SfPolarChart>

       <chart:SfPolarChart.DataContext>
           <local:ViewModel/>
       </chart:SfPolarChart.DataContext>

       <chart:SfPolarChart.Legend>
           <chart:ChartLegend/>
       </chart:SfPolarChart.Legend>

       <chart:PolarAreaSeries Label="Series 1" ItemsSource = "{Binding Data}" XBindingPath="XValue" YBindingPath="YValue"/>
</chart:SfCircularChart>

SfPolarChart chart = new SfPolarChart();

ViewModel viewModel = new ViewModel();
chart.DataContext = viewModel;

chart.Legend = new ChartLegend();

PolarAreaSeries series = new PolarAreaSeries()
{
    ItemsSource = viewmodel.Data,
    XBindingPath = "XValue",
    YBindingPath = "YValue",
    Label="Series 1"
};
chart.Series.Add(series);

Data Label

Data labels are used to display values related to a chart segment. To render the data labels, you need to enable the ShowDataLabels property as true in ChartSeries class.

To customize the chart data labels alignment, placement and label styles, need to create an instance of PolarDataLabelSettings and set to the DataLabelSettings property.

MainPage.xaml
MainPage.xaml.cs

<chart:SfPolarChart>

       <chart:SfPolarChart.DataContext>
           <local:ViewModel/>
       </chart:SfPolarChart.DataContext>

       < chart:PolarAreaSeries ShowDataLabels = "True"
                               ItemsSource="{Binding Data}"
                               XBindingPath="XValue"
                               YBindingPath="YValue"/>
</chart:SfPolarChart>

SfPolarChart chart = new SfPolarChart();

ViewModel viewModel = new ViewModel();
chart.DataContext = viewModel;

PolarAreaSeries series = new PolarAreaSeries()
{
    ItemsSource = viewmodel.Data,
    XBindingPath = "XValue",
    YBindingPath = "YValue",
    ShowDataLabels = true
};
chart.Series.Add(series);

Constructors

SfPolarChart()

Initializes a new instance of the SfPolarChart class.

Declaration

public SfPolarChart()

Fields

GridLineTypeProperty

Identifies the GridLineType dependency property.

Declaration

public static readonly DependencyProperty GridLineTypeProperty

Field Value

Type	Description
Microsoft.UI.Xaml.DependencyProperty	The identifier for `GridLineType` dependency property.

PaletteBrushesProperty

Identifies the PaletteBrushes dependency property.

Declaration

public static readonly DependencyProperty PaletteBrushesProperty

Field Value

Type	Description
Microsoft.UI.Xaml.DependencyProperty	The identifier for `PaletteBrushes` dependency property.

PrimaryAxisProperty

Identifies the PrimaryAxis dependency property.

Declaration

public static readonly DependencyProperty PrimaryAxisProperty

Field Value

Type	Description
Microsoft.UI.Xaml.DependencyProperty	The identifier for `PrimaryAxis` dependency property.

SecondaryAxisProperty

Identifies the SecondaryAxis dependency property.

Declaration

public static readonly DependencyProperty SecondaryAxisProperty

Field Value

Type	Description
Microsoft.UI.Xaml.DependencyProperty	The identifier for `SecondaryAxis` dependency property.

SeriesProperty

Identifies the Series dependency property.

Declaration

public static readonly DependencyProperty SeriesProperty

Field Value

Type	Description
Microsoft.UI.Xaml.DependencyProperty	The identifier for `Series` dependency property.

StartAngleProperty

Identifies the StartAngle dependency property.

Declaration

public static readonly DependencyProperty StartAngleProperty

Field Value

Type	Description
Microsoft.UI.Xaml.DependencyProperty	The identifier for `StartAngle` dependency property.

Properties

GridLineType

Gets or sets the gridline type value that can be used to modify the polar chart grid line type to Polygon or Circle.

Declaration

public PolarChartGridLineType GridLineType { get; set; }

Property Value

Type	Description
PolarChartGridLineType	It accepts the PolarChartGridLineType value and its default value is Circle.

    <chart:SfPolarChart GridLineType="Polygon">

    <!--omitted for brevity-->

         <chart:PolarAreaSeries ItemsSource="{Binding Data}"
                                XBindingPath="XValue"
                                YBindingPath="YValue"/>

    </chart:SfPolarChart>

    SfPolarChart chart = new SfPolarChart();
    chart.GridLineType = PolarChartGridLineType.Polygon;
    ViewModel viewmodel = new ViewModel();

    // omitted for brevity
    PolarAreaSeries series = new PolarAreaSeries();
    series.ItemsSource = viewmodel.Data;
    series.XBindingPath = "XValue";
    series.YBindingPath = "YValue";
    chart.Series.Add(series);

PaletteBrushes

Gets or sets the list of brushes that can be used to customize the appearance of the chart.

Declaration

public IList<Brush> PaletteBrushes { get; set; }

Property Value

Type	Description
System.Collections.Generic.IList<Microsoft.UI.Xaml.Media.Brush>	This property accepts a list of brushes as input and comes with a set of predefined brushes by default.

Remarks

It allows custom brushes, and gradient brushes to customize the appearance.

Examples

MainPage.xaml
MainPage.xaml.cs

<Grid>
<Grid.Resources>
   <BrushCollection x:Key="customBrushes">
      <SolidColorBrush Color="#4dd0e1"/>
      <SolidColorBrush Color="#26c6da"/>
      <SolidColorBrush Color="#00bcd4"/>
      <SolidColorBrush Color="#00acc1"/>
      <SolidColorBrush Color="#0097a7"/>
      <SolidColorBrush Color="#00838f"/>
   </BrushCollection>
</Grid.Resources>

<chart:SfPolarChart PaletteBrushes="{StaticResource customBrushes}">

<!--omitted for brevity-->

</chart:SfPolarChart>
</Grid>

SfPolarChart chart = new SfPolarChart();
ViewModel viewModel = new ViewModel();
List<Brush> CustomBrushes = new List<Brush>();
CustomBrushes.Add(new SolidColorBrush(Color.FromArgb(255, 77, 208, 225)));
CustomBrushes.Add(new SolidColorBrush(Color.FromArgb(255, 38, 198, 218)));
CustomBrushes.Add(new SolidColorBrush(Color.FromArgb(255, 0, 188, 212)));
CustomBrushes.Add(new SolidColorBrush(Color.FromArgb(255, 0, 172, 193)));
CustomBrushes.Add(new SolidColorBrush(Color.FromArgb(255, 0, 151, 167)));
CustomBrushes.Add(new SolidColorBrush(Color.FromArgb(255, 0, 131, 143)));

// omitted for brevity

chart.PaletteBrushes = CustomBrushes;

this.Content = chart;

PrimaryAxis

Gets or sets the x- axis for SfPolarChart.

Declaration

public ChartAxis PrimaryAxis { get; set; }

Property Value

Type	Description
ChartAxis	It accepts the value.

Examples

MainWindow.xaml
MainWindow.cs

    <chart:SfPolarChart>

          <chart:SfPolarChart.PrimaryAxis>
              <chart:NumericalAxis/>
          </chart:SfPolarChart.NumericalAxis>

          <chart:SfPolarChart.SecondaryAxis>
              <chart:NumericalAxis/>
          </chart:SfPolarChart.SecondaryAxis>

    </chart:SfPolarChart>

    SfPolarChart chart = new SfPolarChart();

    chart.PrimaryAxis = new NumericalAxis();
    chart.SecondaryAxis = new NumericalAxis();

SecondaryAxis

Gets or sets the y-axis for SfPolarChart.

Declaration

public RangeAxisBase SecondaryAxis { get; set; }

Property Value

Type	Description
RangeAxisBase	It accepts the RangeAxisBase value.

Examples

MainWindow.xaml
MainWindow.cs

    <chart:SfPolarChart>

          <chart:SfPolarChart.PrimaryAxis>
              <chart:NumericalAxis/>
          </chart:SfPolarChart.NumericalAxis>

          <chart:SfPolarChart.SecondaryAxis>
              <chart:NumericalAxis/>
          </chart:SfPolarChart.SecondaryAxis>

    </chart:SfPolarChart>

    SfPolarChart chart = new SfPolarChart();

    chart.PrimaryAxis = new NumericalAxis();
    chart.SecondaryAxis = new NumericalAxis();

Series

Gets or sets a collection of series to be added to the chart.

Declaration

public PolarSeriesCollection Series { get; set; }

Property Value

Type	Description
PolarSeriesCollection	It accepts the PolarSeriesCollection value.

Remarks

To render a series, create an instance of required series class, and add it to the collection.

Examples

MainWindow.xaml
MainWindow.cs

    <chart:SfPolarChart>

         <!--omitted for brevity-->

         <chart:PolarAreaSeries ItemsSource="{Binding Data}" 
                                XBindingPath="XValue" 
                                YBindingPath="YValue"/>

    </chart:SfPolarChart>

    SfPolarChart chart = new SfPolarChart();
    ViewModel viewmodel = new ViewModel();

    // omitted for brevity
    PolarAreaSeries series = new PolarAreaSeries();
    series.ItemsSource = viewmodel.Data;
    series.XBindingPath = "XValue";
    series.YBindingPath = "YValue";
    chart.Series.Add(series);

StartAngle

Gets or sets the value that can be used to modify the series starting angle.

Declaration

public ChartPolarAngle StartAngle { get; set; }

Property Value

Type	Description
ChartPolarAngle	It accepts the ChartPolarAngle value and it has the default value of Rotate270.

Remarks

It allows for modifying the series rendering position on four degrees: 0, 90, 180, and 270.

Examples

MainWindow.xaml
MainWindow.cs

    <chart:SfPolarChart StartAngle="Rotate0">

    <!--omitted for brevity-->

         <chart:PolarAreaSeries ItemsSource="{Binding Data}" 
                                XBindingPath="XValue" 
                                YBindingPath="YValue"/>

    </chart:SfPolarChart>

    SfPolarChart chart = new SfPolarChart();
    chart.StartAngle = ChartPolarAngle.Rotate0;
    ViewModel viewmodel = new ViewModel();

    // omitted for brevity
    PolarAreaSeries series = new PolarAreaSeries();
    series.ItemsSource = viewmodel.Data;
    series.XBindingPath = "XValue";
    series.YBindingPath = "YValue";
    chart.Series.Add(series);

Methods

OnApplyTemplate()

Declaration

protected override void OnApplyTemplate()

Overrides

ChartBase.OnApplyTemplate()

Implements

System.IDisposable

WinUI- v20.4.0.38

Class SfPolarChart

Inheritance

Implements

Inherited Members

Namespace: Syncfusion.UI.Xaml.Charts

Assembly: Syncfusion.Chart.WinUI.dll

Syntax

Remarks

Constructors

SfPolarChart()

Declaration

Fields

GridLineTypeProperty

Declaration

Field Value

PaletteBrushesProperty

Declaration

Field Value

PrimaryAxisProperty

Declaration

Field Value

SecondaryAxisProperty

Declaration

Field Value

SeriesProperty

Declaration

Field Value

StartAngleProperty

Declaration

Field Value

Properties

GridLineType

Declaration

Property Value

Examples

PaletteBrushes

Declaration

Property Value

Remarks

Examples

PrimaryAxis

Declaration

Property Value

Examples

SecondaryAxis

Declaration

Property Value

Examples

Series

Declaration

Property Value

Remarks

Examples

StartAngle

Declaration

Property Value

Remarks

Examples

Methods

OnApplyTemplate()

Declaration

Overrides

Implements