Dynamic RadCartesianChart with Dynamic Series

4 posts, 0 answers
  1. Stefan
    Stefan avatar
    4 posts
    Member since:
    Jan 2014

    Posted 27 Jan 2014 Link to this post

    Hi,

    I want to display dynamic data with a dynamic count of series.

    There is already a, in my opinion, very straight forward solution for this in a RadChart (only difference is that I'm doing it with a StackedBarSeries, but it works as well).

    Luis said:Hello,

    I have a data structure like this:
    Year - Team - Value
    2010 - T1 - 50
    2010 - T2 - 70
    2009 - T1 - 40
    2009 - T2 - 45
    ...

    Years and teams can growing dinamically. I need a Bar Chart where:
    - One data serie for each team
    - Years in the axis X
    - One bar for each serie in each year with the value as height

    I've seen the "Data Binding with Automatic Series Mappings" sample, but it's not what i need.

    Please, help me.
    Thanks a lot.


    <telerik:RadChart x:Name="RadChart1" >
        <telerik:RadChart.SeriesMappings>
            <telerik:SeriesMapping>
                <telerik:SeriesMapping.SeriesDefinition>
                    <telerik:StackedBarSeriesDefinition />
                </telerik:SeriesMapping.SeriesDefinition>
                <telerik:SeriesMapping.GroupingSettings>
                    <telerik:GroupingSettings ShouldCreateSeriesForLastGroup="True">
                        <telerik:GroupingSettings.GroupDescriptors>
                            <telerik:ChartGroupDescriptor Member="Team"/>
                        </telerik:GroupingSettings.GroupDescriptors>
                    </telerik:GroupingSettings>
                </telerik:SeriesMapping.GroupingSettings>
                <telerik:SeriesMapping.ItemMappings>
                    <telerik:ItemMapping FieldName="Value" DataPointMember="YValue" />
                    <telerik:ItemMapping FieldName="Year" DataPointMember="XCategory" />
                </telerik:SeriesMapping.ItemMappings>
            </telerik:SeriesMapping>
        </telerik:RadChart.SeriesMappings>
    </telerik:RadChart>

    public partial class Example2 : UserControl
    {
        public Example2()
        {
            InitializeComponent();
     
            List<Record> data = new List<Record>()
                {
                    new Record(2009, "First team", 25),
                    new Record(2010, "First team", 35),
                    new Record(2011, "First team", 45),
                    new Record(2009, "Second team", 15),
                    new Record(2010, "Second team", 25),
                    new Record(2011, "Second team", 75),
                    new Record(2009, "Third team", 67),
                    new Record(2010, "Third team", 20),
                    new Record(2011, "Third team", 88),
                    new Record(2009, "Fourth team", 34),
                    new Record(2010, "Fourth team", 67),
                    new Record(2011, "Fourth team", 91),
                    new Record(2009, "Fifth team", 87),
                    new Record(2010, "Fifth team", 77),
                    new Record(2011, "Fifth team", 12)
                };
     
            this.RadChart1.ItemsSource = data;
        }
    }
     
    public class Record
    {
        public Record(int year, string team, int value)
        {
            Year = year;
            Team = team;
            Value = value;
        }
     
        public int Value { get; set; }
        public string Team { get; set; }
        public int Year { get; set; }
    }

    Is it possible to do the same thing like in the link with a RadCartesianChart? Or should I stick with the RadChart?
  2. Martin
    Admin
    Martin avatar
    1101 posts

    Posted 28 Jan 2014 Link to this post

    Hi Stefan,

    Yes, it is possible to achieve the same result with the RadChartView. You can use the ChartSeriesProvider to create series dynamically and the CombineMode property of the BarSeries to stack the bars. You can see how the CombineMode works in our RadChartView Bar demo.

    Please, also note that the RadChart has many known limitations and I strongly recommend that you use the new charting components instead.

    I prepared a project to demonstrate my implementation.

    Regards,
    Martin Ivanov
    Telerik
    TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for WPF.
    Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
    Sign up for Free application insights >>
  3. UI for WPF is Visual Studio 2017 Ready
  4. Stefan
    Stefan avatar
    4 posts
    Member since:
    Jan 2014

    Posted 28 Jan 2014 in reply to Martin Link to this post

    Thanks for your answer and the good explanation!

    Only thing that still isn't quite clear with the CategoricalSeriesDescriptor is how to style the Labels of the Axis and the Points, respectively how to format the values, because the style only has a setter to show labels, but nothing for a LabelFormat.

    My value is a double value that represents a percentage, do you know how I can set the Axis Labels and the Point Labels to the format P2, for example?
  5. Martin
    Admin
    Martin avatar
    1101 posts

    Posted 29 Jan 2014 Link to this post

    Hello Stefan,

    You can set the template for the labels of the axes by using their LabelTemplate property. To set template for the DataPoints labels you will need to add new LabelDefinition in your BarSeries. Also, note that you cannot add a label definition through a style setter, because the LabelDefinitions property is not a dependency object. That's why you should register a new attached property to add a new template for each series. You could also take a look at our Label Template Customization demo.

    For your convenience I updated my last project to demonstrate the use of the above mentioned approaches. 

    Regards,
    Martin Ivanov
    Telerik
    TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for WPF.
    Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
    Sign up for Free application insights >>
Back to Top