Problem with sorting AxisX

5 posts, 1 answers
  1. Frank
    Frank avatar
    12 posts
    Member since:
    May 2011

    Posted 08 Jun 2011 Link to this post

    Hello,

    if I'm using multiple datasources. The datamember for AxisX is from type DateTime. If there are for example two series with following date values:

    series 1:
    • March 2011
    • April 2011
    • June 2011
    • July 2011
    • September 2011

    series 2:
    • January 2011
    • February 2011
    • March 2011
    • April 2011
    • June 2011
    • July 2011
    • September 2011

    In this case the chart automatically sorts it like in the attached image. That causes a really ugly line (see also attached image) that is not suitible to what I want to have. 

    I tried to use a ChartSortDescriptor on each series that was not working:
    private void CreateSeriesMappings()
    {
        SeriesMappingCollection mappingCollection = new SeriesMappingCollection();
        for (int i = 0; i < Data.Count; i++)
        {
            mappingCollection.Add(CreateNewSeriesMapping(i));
        }
        this.SeriesMappings = mappingCollection;
    }
     
    private static SeriesMapping CreateNewSeriesMapping(int collectionIndex)
    {
        SeriesMapping series = new SeriesMapping
        {
            CollectionIndex = collectionIndex,
            SeriesDefinition = new LineSeriesDefinition()
        };
        series.ItemMappings.Add(new ItemMapping("Date", DataPointMember.XCategory));
        series.ItemMappings.Add(new ItemMapping("Value", DataPointMember.YValue));
        series.GroupingSettings.ShouldFlattenSeries = true;
        series.GroupingSettings.GroupDescriptors.Add(new ChartYearGroupDescriptor("Date"));
        series.SortDescriptors.Add(new ChartSortDescriptor("Date", ListSortDirection.Ascending));
     
        return series;
    }

    If I am using a ChartSortDescriptor on the chart:
    <telerik:RadChart x:Name="Chart1" ItemsSource="{Binding Data}">
                    <telerik:RadChart.SortDescriptors>
                        <telerik:ChartSortDescriptor Member="Date" SortDirection="Ascending" />
                    </telerik:RadChart.SortDescriptors>
                    <telerik:RadChart.DefaultView>
                        <telerik:ChartDefaultView>
                            <telerik:ChartDefaultView.ChartLegend>
                                <telerik:ChartLegend Name="legend3"/>
                            </telerik:ChartDefaultView.ChartLegend>
                            <telerik:ChartDefaultView.ChartArea>
                                <telerik:ChartArea LegendName="legend3">
                                    <telerik:ChartArea.AxisX>
                                        <telerik:AxisX x:Name="axisX" DefaultLabelFormat="yyyy MMM" LayoutMode="Between" LabelRotationAngle="45" />
                                    </telerik:ChartArea.AxisX>
                                    <telerik:ChartArea.AxisY>
                                        <telerik:AxisY ExtendDirection="Smart" />
                                    </telerik:ChartArea.AxisY>
                                </telerik:ChartArea>
                            </telerik:ChartDefaultView.ChartArea>
                        </telerik:ChartDefaultView>
                    </telerik:RadChart.DefaultView>
                </telerik:RadChart>

    This also does not work. 

    How do I get this axis sorted? Maybe you could give me a hint. 

    Thanks in andvance!

    Regards,
    Julian
  2. Peshito
    Admin
    Peshito avatar
    589 posts

    Posted 13 Jun 2011 Link to this post

    Hi Frank,

    The reason why your chart looks like this is just because you used DataPointMember.XCategory (which is used for strings). Try using XValue property instead. You may find the following topics useful.

    http://www.telerik.com/help/silverlight/radchart-features-categorical-charts.html
    http://www.telerik.com/help/silverlight/radchart-features-datetime-support.html
    http://www.telerik.com/help/silverlight/radchart-features-axes-x-axis.html
    http://www.telerik.com/help/silverlight/radchart-features-axes-y-axis.html

    All the best,
    Peshito
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. Frank
    Frank avatar
    12 posts
    Member since:
    May 2011

    Posted 14 Jun 2011 Link to this post

    If I use the XValue instead of XCategory the GroupDescriptor does not work anymore. 
  4. Frank
    Frank avatar
    12 posts
    Member since:
    May 2011

    Posted 15 Jun 2011 Link to this post

    Here some images of what the problem is, if i use XValue instead of XCategory. (Take a look at the xAxis)

  5. Answer
    Peshito
    Admin
    Peshito avatar
    589 posts

    Posted 16 Jun 2011 Link to this post

    Hi Frank,

    Try setting the AxisX.TicksDistance to 200 or even 300. The default value is 50 which in your case is not enough for properly displaying the ticks and their values. You can find more information regarding TickDistance here.

    In your XValue screenshot values are properly displayed, however this format omits the date and this is why they are all displayed as 2010 Jan, 2010 Feb and etc. If you use another format like yyyy MMM ddd, you would see that the values are correct.

    Alternatively, you can switch back to XCategory property instead of XValue, but you should make the sorting before binding the chart and remove the ChartSortDescriptor. As I mentioned, XCategory is used for strings, so the chart will not sort the values as DateTime values. This is why pre-sorting is required.


    Kind regards,
    Peshito
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
Back to Top