Nevron Open Vision Documentation
Chart / Charts / Types / Radar / Radar Chart
In This Topic
    Radar Chart
    In This Topic

    The radar chart (also known as spider or star chart) is a two-dimensional chart that shows the relationship between three or more variables represented on axes starting from the same point. The following code shows how to create a simple radar chart:

    C#
    Copy Code

    // Add a NOV widget inside the form
    NChartView chartView = new NChartView();

    // create a dock panel with label and chart
    NDockPanel dockPanel = new NDockPanel();
    chartView.Surface.Content = dockPanel;

    // create a docked label
    NLabel label = new NLabel();
    label.Text =
    "My First Radar Chart";
    label.Margins =
    new NMargins(10);
    label.Font =
    new NFont(NFontDescriptor.DefaultSansFamilyName, 12);
    label.TextFill =
    new NColorFill(NColor.Black);
    label.TextAlignment =
    ENContentAlignment.MiddleCenter;
    NDockLayout.SetDockArea(label, ENDockArea.Top);
    dockPanel.AddChild(label);

    // create a new polar chart
    NRadarChart radarChart = new NRadarChart();
    radarChart.Margins =
    new NMargins(10);
    NDockLayout.SetDockArea(radarChart, ENDockArea.Center);
    dockPanel.AddChild(radarChart);
    AddAxis(radarChart,
    "Vitamin A");
    AddAxis(radarChart,
    "Vitamin B");
    AddAxis(radarChart,
    "Vitamin C");
    AddAxis(radarChart,
    "Vitamin D");

    // create a radar area series
    NRadarAreaSeries radarSeries = new NRadarAreaSeries();
    radarSeries.DataPoints.Add(
    new NRadarAreaDataPoint(20));
    radarSeries.DataPoints.Add(
    new NRadarAreaDataPoint(80));
    radarSeries.DataPoints.Add(
    new NRadarAreaDataPoint(34));
    radarSeries.DataPoints.Add(
    new NRadarAreaDataPoint(79));
    radarChart.Series.Add(radarSeries);

     Single and Multi Measure Radar
    There are two types of radar charts - single and multi measure. Single measure radar charts are used when you want to compare values with common measurement and magnitude (for example the chart created by the above code is a single measure radar as the vitamins are compared on the same scale that ranges from 0 to 100).

    Multi measure radar charts on the other hand are used when you want to compare values that differ in magnitude and/or measure. By default when you create a radar chart it will be configured as single measure radar. To switch to multi measure radar chart you must set the RadarMode property to ENRadarMode.MultiMeasure. The following code snippet shows how to do that:

    C#
    Copy Code

    radarChart.RadarMode = ENRadarMode.MultiMeasure;

     Radar Category Titles

    Each radar axis can be annotated with a text label. This label can appear on the outer side of the radar rim and there are various properties you can touch to modify its appearance and alignment. This section describes those properties and how they work together.

    Title Angle

    The radar axis title angle is controlled from the TitleAngle property, which accepts an object of type NScaleLabelAngle. The following code snippet applies horizontal orientation to the radar label:

    C#
    Copy Code

    NRadarAxis radarAxis = new NRadarAxis();
    radarAxis.Title =
    "Radar Axis";
    radarAxis.TitleAngle =
    new NScaleLabelAngle(ENScaleLabelAngleMode.View, 0);
    radarChart.Axes.Add(radarAxis);

    Title Offset

    The title offset controls the distance between the radar axis title and the outer radar rim. Increasing this value will move the radar axis titles farther from the radar plot - the following code snippet applied a distance of 20 dips between the radar rim and the title:

    C#
    Copy Code

    NRadarAxis radarAxis = new NRadarAxis();
    radarAxis.Title =
    "Radar Axis";
    radarAxis.TitleAngle =
    new NScaleLabelAngle(ENScaleLabelAngleMode.View, 0);
    radarAxis.TitleOffset = 20;
    radarChart.Axes.Add(radarAxis);

    Title Position Mode

    The title position mode specifies how the title is positioned relative to the ray defined from the center of the radar chart and the radar axis. There are two options:

    ENRadarTitlePositionMode Description
    Center Title is positioned so that its center point lies on the radar axis vector (this is the default)
    NearestPoint Title is positioned so that the nearest point of the title that does not touch the radar rim lies on the radar axis vector

    The following pictures show how the labels will be positioned depending on the value of hte TitlePositionMode property:

    ENRadarTitlePositionMode.Center ENRadarTitlePositionMode.NearestPoint

     

     The following code snippet modifies the radar title position mode:

    C#
    Copy Code

    NRadarAxis radarAxis = new NRadarAxis();
    radarAxis.Title =
    "Radar Axis";
    radarAxis.TitlePositionMode =
    ENRadarTitlePositionMode.NearestPoint;
    radarChart.Axes.Add(radarAxis);

    Title Text Alignment

    When you have multi line radar axis titles it is sometimes necessary to specify left, right or center alignment depending on the position of the title relative to the radar center. This is achieved by setting the TitleAutomaticAlignment property to true:

    C#
    Copy Code

    radarAxis.TitleAutomaticAlignment = true;

    The following picture shows the effect of this property:

     

     

    See Also