# Radar Line Chart The Blazor Radar Line chart shows the data points on radial lines starting from a common center and act as value axis. The closer the data point to the center, the lower its value. The Radar Line chart connects the values of the data points with lines. Radar line charts are often used to make comparisons between several units that depend on a multitude of quantitative factors, with the compared units being the individual series, and the factors being the categories. The lack of overlap between the series makes it easier to compare individual values in addition to overall coverage. ![Radar line chart showing values across categories](https://www.telerik.com/blazor-ui/documentation/assets/16246e955e4977f102909d9a0d4b1036/radar-line-chart.png) This article assumes you are familiar with the [chart basics](https://www.telerik.com/blazor-ui/documentation/components/chart/overview) and [data binding](https://www.telerik.com/blazor-ui/documentation/components/chart/data-bind). #### To create a radar line chart: 1. add a `ChartSeries` to the `ChartSeriesItems` collection 2. set its `Type` property to `ChartSeriesType.RadarLine` 3. provide a data collection to its `Data` property 4. optionally, provide data for the x-axis `Categories` > caption A radar column chart that shows comparison between the nutritional composition of two foods ## Radar Line Chart Specific Appearance Settings ### Color The color of a series is controlled through the `Color` property that can take any valid CSS color (for example, `#abcdef`, `#f00`, or `blue`). You can control the color of the markers by using the Background property of the nested `ChartSeriesMarkers` tag. ### ColorField You can pass a `ColorField` to the chart as a part of the model, and the data points (markers) will use that color instead of the `Color` of the series or the `Background` of the markers settings. ### Missing Values If some values are missing from the series data (they are `null`), you can have the chart work around this by setting the `MissingValues` property of the series to the desired behavior (member of the `Telerik.Blazor.ChartSeriesMissingValues` enum): * `Zero` - the default behavior. The line goes to the 0 value mark. * `Interpolate` - the line will go through the interpolated value of the missing data points and connect to the next data point with a value. * `Gap` - there will be no line for the category that misses a value. ### Line Style You can render the lines between the points with different styles. The supported styles can be set via the `Style` property that takes a member of `Telerik.Blazor.ChartSeriesStyle` enum: * `Normal`—This is the default style. It produces a straight line between data points. * `Step`—Behaves in the same way as `Normal` for a Radar Line chart. * `Smooth`—This style causes the Chart to display a fitted curve through data points. It is suitable when the data requires to be displayed with a curve, or when you wish to connect the points with smooth instead of straight lines. ### Customize Chart Elements - Nested Tags Settings When configuring nested properties and child elements in your chart, the inner tags will contain their parent tag name and add specifics to its end. In general the structure of such nested tags will be `` where the Category can be one of the following: * CategoryAxis * ChartArea * Legend * PlotArea * SeriesItems * Title * Tooltip * ValueAxis * XAxes * YAxes * and others > tip To customize the chart, look for nested tags and their properties - the inner tags will contain their parent tag name and add specifics to its end. For example, the `ChartSeries` tag has a `ChartSeriesLabels` tag that exposes configuration options and more child tags. An example of this is the rotation the Labels of a [categorical](https://www.telerik.com/blazor-ui/documentation/components/chart/data-bind#series-types) chart. You can use the `ChartCategoryAxes` > `ChartCategoryAxis` > `ChartCategoryAxisLabels` > `ChartCategoryAxisLabelsRotation` tag and set the `Angle` property to the desired value in degrees (they might be negative or positive numbers). By using similar approach you can take control over `ChartCategoryAxisLabelsMargin` (add margin for top, bottom, left and right), `ChartCategoryAxisLabelsPadding` (add padding for top, bottom, left and right) and others. This approach is not limited only to the Labels - it can be used with all tags that are applicable for the chart type, for example the Chart Title `ChartTitle` > `ChartTitleMargin`. ## See Also * [Live Demo: Radar Line Chart](https://demos.telerik.com/blazor-ui/chart/radar-line-chart)