RadChart X Axis label format won't work if it is in a template

[Sunny]

I have a line chart set to display datetime for X-Axis to display DefaultLabelFormat="#VAL{hh:mm:ss}" If the radchart is directly set in the xaml it works fine. However if it is in a datatemplate and rendered through a contentpresenter, it won;t work. even the title and legend won't show up neither. It always display the full date string which getting overlap. See the upper chart. ( In my case I have to put it into a template as that is part of the content in an itemscontrol, I had a hard time to find out that the template gets into the way.) Anybody run into similar issue? what is the solution?

< 

Window x:Class="WpfApplication3.MainWindow"  

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

 Title="MainWindow" Height="521" Width="525"

 xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation">
<Window.Resources >

     <DataTemplate x:Key="GraphTemplate" >   

<Grid >

   <telerik:RadChart Height="264" ItemsSource="{Binding DataList}" Margin="34,21,0,0" x:Name="radChart1" VerticalAlignment="Top" HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch">

     <telerik:RadChart.SeriesMappings >

         <telerik:SeriesMapping LegendLabel="T" >

             <telerik:SeriesMapping.SeriesDefinition >

                 <telerik:LineSeriesDefinition ShowItemLabels="False" ShowPointMarks="False" />

             </telerik:SeriesMapping.SeriesDefinition>

             <telerik:SeriesMapping.ItemMappings >

                 <telerik:ItemMapping DataPointMember="XValue" FieldName="Dt" />

                 <telerik:ItemMapping DataPointMember="YValue" FieldName="Data" />

             </telerik:SeriesMapping.ItemMappings>

         </telerik:SeriesMapping>

     </telerik:RadChart.SeriesMappings>

     
    <telerik:RadChart.DefaultView >

         <telerik:ChartDefaultView >

             <telerik:ChartDefaultView.ChartArea >

                 <telerik:ChartArea >

                     <telerik:ChartArea.AxisX >

                         <telerik:AxisX DefaultLabelFormat="#VAL{hh:mm:ss}" LabelRotationAngle="70" LabelStep="2" Title="Time1" />

                     </telerik:ChartArea.AxisX>

                 </telerik:ChartArea>

             </telerik:ChartDefaultView.ChartArea>

         </telerik:ChartDefaultView>

     </telerik:RadChart.DefaultView>

 </telerik:RadChart>

 </Grid>

 </DataTemplate>

</Window.Resources>

 
<Grid x:Name="maingrid" Loaded="Grid_Loaded">

    <Grid.RowDefinitions>

        <RowDefinition />

         <RowDefinition />

     </Grid.RowDefinitions>

 
<!--going through the template will not get x_axis in correct format-->

<ContentPresenter Grid.Row="0" ContentTemplate="{StaticResource GraphTemplate}" Content="{Binding }" />

 <!--this will get the x-axis correct. the code is the same as what in the template-->

 <telerik:RadChart Grid.Row="1" Height="264" ItemsSource="{Binding DataList}" Margin="34,21,0,0" x:Name="radChart1" VerticalAlignment="Top" HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch">

     <telerik:RadChart.SeriesMappings >

        <telerik:SeriesMapping LegendLabel="T" >

        <telerik:SeriesMapping.SeriesDefinition >

            <telerik:LineSeriesDefinition ShowItemLabels="False" ShowPointMarks="False" />

             </telerik:SeriesMapping.SeriesDefinition>

         <telerik:SeriesMapping.ItemMappings >

             <telerik:ItemMapping DataPointMember="XValue" FieldName="Dt" />

             <telerik:ItemMapping DataPointMember="YValue" FieldName="Data" />

         </telerik:SeriesMapping.ItemMappings>

     </telerik:SeriesMapping>

 </telerik:RadChart.SeriesMappings>

 

<telerik:RadChart.DefaultView >

     <telerik:ChartDefaultView >

         <telerik:ChartDefaultView.ChartArea >

                <telerik:ChartArea >

                     <telerik:ChartArea.AxisX >

                         <telerik:AxisX DefaultLabelFormat="#VAL{hh:mm:ss}" LabelRotationAngle="70" LabelStep="2" Title="Time1" />

                     </telerik:ChartArea.AxisX>

             </telerik:ChartArea>

         </telerik:ChartDefaultView.ChartArea>

 </telerik:ChartDefaultView>

 </telerik:RadChart.DefaultView>

 </telerik:RadChart>

 </Grid>

</

Window>

 

[Sia]

Hello Sunny,

Unfortunately I should confirm that there is a known problem when setting some of the properties in RadChart when it is in a datatemplate. The issue is logged in our Public Issues Tracking System.

As a workaround I can suggest you to wrap RadChart in a UserControl.

Kind regards,
Sia
the Telerik team

[Sunny]

Thanks Sia.
Do you mean to wrap RadChart in a usercontrol instead of DataTemplate? I need it to be in data template is because I need to put into an ItemsControl. Without the Datatemplate I need to set each item specifically for a long list? basically each item is the same that is why I need to use item template. Can you get more detail on the workaround? sample code will be appreciated.
We actually have another different case to develop a user control that contains RadChart. The RadChart within the user control is exposed as dependency property, and the user control plan to let the client set the chart (serialmappings, defaultviews....) but the client has a hard time to set the chart in xaml. Another post says XAML doesn't support multi-level property element syntax so far. Any suggestions?
http://social.msdn.microsoft.com/Forums/en-US/wpf/thread/01672fc3-baed-469c-a819-61d12ac94329/

[Sia]

Hi Sunny,

I mean to wrap your RadChart in a UserControl and after that to wrap that UserControl in the mentioned DataTemplate:

<UserControl x:Class="WPFApplication1.RadChartUC"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation">
    <Grid>
        <telerik:RadChart ItemsSource="{Binding ChartData}" SeriesMappings="{Binding ChartSeries}" />
    </Grid>
</UserControl>

<DataTemplate x:Key="MyTemplate"><uc:RadChartUC DataContext="{Binding}" /></DataTemplate>

Greetings,
Sia
the Telerik team

[Sunny]

thanks Sia, it works now.