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

5 posts, 0 answers
  1. Sunny
    Sunny avatar
    10 posts
    Member since:
    Sep 2011

    Posted 31 Oct 2011 Link to this post

    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>

     

  2. Sia
    Admin
    Sia avatar
    667 posts

    Posted 03 Nov 2011 Link to this post

    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

    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

  3. UI for WPF is Visual Studio 2017 Ready
  4. Sunny
    Sunny avatar
    10 posts
    Member since:
    Sep 2011

    Posted 04 Nov 2011 Link to this post

    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/
  5. Sia
    Admin
    Sia avatar
    667 posts

    Posted 09 Nov 2011 Link to this post

    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: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

    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>

  6. Sunny
    Sunny avatar
    10 posts
    Member since:
    Sep 2011

    Posted 09 Nov 2011 Link to this post

    thanks Sia, it works now.
Back to Top
UI for WPF is Visual Studio 2017 Ready