Back to Devexpress

2D Radar Diagram

wpf-115308-controls-and-libraries-charts-suite-chart-control-diagram-2d-radar-diagram.md

latest6.8 KB
Original Source

2D Radar Diagram

  • May 28, 2021
  • 3 minutes to read

The 2D Radar Diagram is used to display data as a circular graph. A radar chart consists of a sequence of spokes dividing the diagram into equiangular sectors, where an each spoke represents one of the variables.

The document includes the following sections:

Compatible Series Types

This diagram can only contain the following compatible series types:

Refer to the Series Type Compatibility document to learn more about series compatibility.

How to Create a Chart with a Radar Diagram

The axis of arguments in the Radar diagram is represented as a circular axis. This axis is available with the RadarDiagram2D.AxisX property.

Note

Note that radar diagram axes do not support additional elements such as constant lines, axis titles, and strips.

The following markup demonstrates how to create a chart with the Radar diagram:

xaml
<dxc:ChartControl>
    <!-- Radar diagram's settings. -->
    <dxc:RadarDiagram2D RotationDirection="Counterclockwise" 
                        ShapeStyle="Polygon" 
                        DomainBrush="AliceBlue"
                        DomainBorderBrush="AliceBlue"
                        StartAngle="180"
                        LabelsResolveOverlappingMinIndent="5">
        <!-- X-axis settings. --> 
        <dxc:RadarDiagram2D.AxisX>
            <dxc:RadarAxisX2D/>
        </dxc:RadarDiagram2D.AxisX>
        <!-- Y-axis settings. -->
        <dxc:RadarDiagram2D.AxisY>
            <dxc:RadarAxisY2D/>
        </dxc:RadarDiagram2D.AxisY>
        <!-- The Radar series settings. -->
        <dxc:RadarPointSeries2D x:Name="series">
            <dxc:SeriesPoint Argument="1/1/2017" Value="2"/>
            <dxc:SeriesPoint Argument="2/1/2017" Value="2"/>
            <dxc:SeriesPoint Argument="3/1/2017" Value="3"/>
            <dxc:SeriesPoint Argument="4/1/2017" Value="5"/>
            <dxc:SeriesPoint Argument="5/1/2017" Value="8"/>
            <dxc:SeriesPoint Argument="6/1/2017" Value="11"/>
            <dxc:SeriesPoint Argument="7/1/2017" Value="13"/>
            <dxc:SeriesPoint Argument="8/1/2017" Value="13"/>
            <dxc:SeriesPoint Argument="9/1/2017" Value="11"/>
            <dxc:SeriesPoint Argument="10/1/2017" Value="8"/>
            <dxc:SeriesPoint Argument="11/1/2017" Value="5"/>
            <dxc:SeriesPoint Argument="12/1/2017" Value="3"/>
        </dxc:RadarPointSeries2D>
    </dxc:RadarDiagram2D>
</dxc:ChartControl>

The following table lists classes and properties that are used in the markup:

Class or PropertyDescription
ChartControlThe Chart control.
RadarDiagram2DThe 2D Radar Diagram.
CircularDiagram2D.RotationDirectionSpecifies the direction in which the diagram’s argument axis is drawn.
CircularDiagram2D.ShapeStyleSpecifies the diagram’s shape style.
CircularDiagram2D.DomainBrushSpecifies the brush used to draw the diagram’s area.
CircularDiagram2D.DomainBorderBrushSpecifies the brush used to draw the diagram’s area border.
CircularDiagram2D.StartAngleSpecifies an angle of deflection from vertical to define an axis origin of coordinates.
CircularDiagram2D.LabelsResolveOverlappingMinIndentSpecifies the minimum gap between two adjacent series point labels.
RadarDiagram2D.AxisXGets or sets the x-axis settings.
RadarAxisX2DThe radar diagram’s circular arguments axis.
RadarDiagram2D.AxisYGets or sets the y-axis settings.
RadarAxisY2DThe radar diagram’s circular axis of values.
RadarLineSeries2DThe Radar Line series.
Series.DisplayNameSpecifies a series display name.
SeriesPointThe series point.
SeriesPoint.ArgumentSpecifies the series point’s argument.
SeriesPoint.ValueSpecifies the series point’s value.

Refer to the code below to access the Radar diagram’s settings at runtime:

csharp
// Cast Diagram to the RadarDiagram2D type. 
RadarDiagram2D diagram = chart.Diagram as RadarDiagram2D;
if (diagram != null) {
    // Access the diagram's options. 
    diagram.ShapeStyle = CircularDiagramShapeStyle.Polygon;
}
vb
' Cast Diagram to the RadarDiagram2D type. 
Dim diagram As RadarDiagram2D = TryCast(chart.Diagram, RadarDiagram2D)
If diagram IsNot Nothing Then
    ' Access the diagram's options. 
    diagram.ShapeStyle = CircularDiagramShapeStyle.Polygon
End If

See Also

2D Polar Diagram

Diagram

Axes