Show chart title

[Alberto]

Hi, I am able to show a title in the RadChart, something like this:

Chart.DefaultView.ChartTitle.Content = "Title";

or

<telerik:RadChart.DefaultView>
                <telerik:ChartDefaultView>
                    <telerik:ChartDefaultView.ChartTitle>
                        <telerik:ChartTitle Content="Title" HorizontalAlignment="Center">

Is it possible to show a title in a RadPolarChart, RadRadialGauge and RadCartesianChart?

I would like to add a title for those kind of charts if possible.

Thanks,

Alberto

[Petar Kirov]

Hi Alberto,

Although RadChartView (RadCartesianChart, RadPolarChart, RadPieChart) and RadGauge do not have built-in titles, you can easily create one, using WPF's built-in controls:

<Border BorderBrush="Black" BorderThickness="1">
    <Grid Margin="10">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <TextBlock Grid.Row="0" Text="Chart Title"
               HorizontalAlignment="Center"/>

        <telerik:RadCartesianChart Grid.Row="1">
            <!--...-->
        </telerik:RadCartesianChart>
    </Grid>
</Border>

I have attached a sample project to demonstrate this with a title UserControl that looks like RadChart's.
 
Regards,
Petar Kirov
Telerik

[Avneesh]

Hi Petar,
The other way would be to insert a title in Cartesian chart control template but i have noticed that default template obtained from expression blend doesn't show tracker line unless the mouse is directly over the series.will it be possible to post the correct control template of cartesianchart used by telerik and I can try with that?

Thanks
Avneesh

[Evgenia]

Hi Alberto,

 Yes, you can add title by retemplating the default RadChartBase style inside the first grid of the Cartesian Chart style, as shown below (to demonstrate this I added Label before the ContentPresenter):

<Style x:Key="RadChartBaseStyle" TargetType="telerik:RadChartBase">
    <Setter Property="FontFamily" Value="Segoe UI"/>
    <Setter Property="FontSize" Value="11"/>
    <Setter Property="MinWidth" Value="100"/>
    <Setter Property="MinHeight" Value="100"/>
    <Setter Property="Background" Value="Yellow" />
    <Setter Property="HorizontalContentAlignment" Value="Center"/>
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="telerik:RadChartBase">
                <Border x:Name="layoutRoot"
                    Background="{TemplateBinding Background}"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    BorderThickness="{TemplateBinding BorderThickness}">
                    <Grid>
                        <Label Name="TitleBar" Background="WhiteSmoke" VerticalAlignment="Top"
                              HorizontalContentAlignment="Center" Content="My Title Here" ClipToBounds="False"/>
                        <ContentPresenter x:Name="emptyContent"
                                      IsHitTestVisible="False"
                                      Content="{TemplateBinding EmptyContent}"
                                      ContentTemplate="{TemplateBinding EmptyContentTemplate}"
                                      HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                      VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                      Visibility="Collapsed"/>
                        <Canvas x:Name="adornerContainer" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Background="Transparent">
                            <Canvas x:Name="labelContainer" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                                <Canvas x:Name="renderSurface" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                                    <Border x:Name="plotAreaDecoration" Style="{TemplateBinding PlotAreaStyle}"/>
                                </Canvas>
                            </Canvas>
                        </Canvas>
                    </Grid>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Setter Property="TrackBallLineStyle">
        <Setter.Value>
            <Style TargetType="Polyline">
                <Setter Property="Stroke" Value="#FF828282" />
                <Setter Property="StrokeThickness" Value="2" />
            </Style>
        </Setter.Value>
    </Setter>
    <Setter Property="DragZoomBorderStyle">
        <Setter.Value>
            <Style TargetType="Border">
                <Setter Property="BorderBrush" Value="#FF828282" />
                <Setter Property="BorderThickness" Value="1" />
                <Setter Property="Background" Value="#40FFFFFF" />
            </Style>
        </Setter.Value>
    </Setter>
</Style>

The Image attached demonstrates the result. Feel free to modify this per your scenario needs.
Also you can find the default templates and styles of Radcontrols in the source code which is distributed to the licensed developers under your local installation path in the Themes folder. 

Regards,
Evgenia
Telerik