Chart Types | ComponentOne FlexChart for UWP

Chart Types

In This Topic

FlexRadar allows you to work with different chart types to meet your data visualization needs. You can use chart types from Area to Scatter to display areas filled with colors or patterns within data depicted within FlexRadar. You can set different chart types for FlexRadar by setting the ChartType property of C1FlexRadar to any of the following values in the RadarChartType enumeration:

Area: Shows area below the line filled with color.
Line: Shows trends over a period of time or across categories.
LineSymbols: Shows line chart with a symbol on each data point.
Scatter: Shows patterns within data using X and Y coordinates.

The following image displays FlexRadar with the chart type as Area.

The following code snippet sets the ChartType property.

XAML
Code

<Chart:C1FlexRadar Header="Fruit Chart" 
                   LegendOrientation="Horizontal" 
                   LegendPosition="Bottom" 
                   ChartType="Area" 
                   StartAngle="10" 
                   Reversed="True" 
                   ItemsSource="{Binding DataContext.Data}" 
                   BindingX="Fruit" 
                   Margin="0,220,20,130" LegendTitle="Month">
    <Chart:C1FlexRadar.LegendStyle>
        <Chart:ChartStyle FontFamily="Arial" 
                          FontSize="10" 
                          FontWeight="Bold" 
                          Stroke="RoyalBlue"/>
    </Chart:C1FlexRadar.LegendStyle>
    <Chart:C1FlexRadar.LegendTitleStyle>
        <Chart:ChartStyle FontFamily="Arial" 
                          FontSize="13" 
                          FontWeight="Bold" 
                          Stroke="#FF371649"/>
    </Chart:C1FlexRadar.LegendTitleStyle>
    <Chart:C1FlexRadar.HeaderStyle>
        <Chart:ChartStyle FontFamily="Arial" 
                          FontSize="14" 
                          FontWeight="Bold" 
                          Stroke="Blue"/>
    </Chart:C1FlexRadar.HeaderStyle>
    <Chart:C1FlexRadar.Series>
        <Chart:Series SeriesName="March" 
                      Binding="March"></Chart:Series>
        <Chart:Series SeriesName="April" 
                      Binding="April"></Chart:Series>
        <Chart:Series SeriesName="May" 
                      Binding="May"></Chart:Series>
    </Chart:C1FlexRadar.Series>
</Chart:C1FlexRadar>

C#	Copy Code
// set the FlexRadar chart type flexRadar.ChartType = C1.Chart.RadarChartType.Area;

VB	Copy Code
' set the FlexRadar chart type flexRadar.ChartType = C1.Chart.RadarChartType.Area