Details

How to customize the appearance of a chart series in a RadChart control using ItemStyle

RELATED TO:

Article information
Article relates to	RadChart for WPF
Created by	Telerik Admin
Last modified	02/18/2009
Last modified by	Telerik Admin

You can leverage the ItemStyle property of the ChartSeriesDefinition to customize each individual chart series appearance. All you need to do is to provide the necessary styles as resources. Then just find the correct resource and set it to ItemStyle property.

Let us take an example. You can define the following style:

    <Window.Resources>  
         <LinearGradientBrush x:Key="RedBrush" StartPoint="0.5, 0" EndPoint="0.5, 1">  
             <GradientBrush.GradientStops>  
                 <GradientStop Color="White" Offset="0"></GradientStop>  
                 <GradientStop Color="Red" Offset="1"></GradientStop>  
             </GradientBrush.GradientStops>  
         </LinearGradientBrush>  
         <Style x:Key="MyStyle" >  
             <Setter Property="Template" >  
                 <Setter.Value>  
                     <ControlTemplate TargetType="{x:Type telerik:Bar}">  
                         <Rectangle  
                                    x:Name="PART_DefiningGeometry"  
                                    Fill="{StaticResource RedBrush}"   
                                    Stroke="Pink"   
                                    StrokeThickness="3"   
                                    Height="{TemplateBinding ActualHeight}"  
                                    Width="{TemplateBinding ActualWidth}"/>  
                     </ControlTemplate>  
                 </Setter.Value>  
             </Setter>  
         </Style>  
     </Window.Resources>  
  

Now all you need to do is set this style to the ItemStyle property of the SeriesDefinition:

    barSeries.Definition.ItemStyle = this.FindResource("MyStyle") as Style;  
  

We can hide the legend and play a bit with gridlines and striplines

    RadChart1.DefaultView.ChartLegend.Visibility = Visibility.Collapsed; 

            RadChart1.DefaultView.ChartArea.AxisX.StripLinesVisibility = Visibility.Collapsed;

            RadChart1.DefaultView.ChartArea.AxisY.MajorGridLinesVisibility = Visibility.Visible;

            RadChart1.DefaultView.ChartArea.AxisY.StripLinesVisibility = Visibility.Collapsed;

and after populating the chart with some random data, we get the chart shown in the image below.
RadChart

Related Products

Telerik UI for ASP.NET Core

How to customize the appearance of a chart series in a RadChart control using ItemStyle

Related Products

More Resources