Binding multiple series

10 posts, 0 answers
  1. Brendan
    Brendan avatar
    34 posts
    Member since:
    Oct 2010

    Posted 17 Jan 2011 Link to this post

    Hello, I've been struggling with this for a while now and just wanted to now if it's possible to draw a chart using a list of series, each containing a list of values. For example the classes below:

        public class Series
        {
            public string Name { get; set; }
            public List<Values> Values { get; set; }
        }

        public class Values
        {
            public DateTime Timestamp { get; set; }
            public double Value { get; set; }
        }

    If I then have a View Model like:

        public class ViewModel
        {
            public List<Series> Series { get; set; }
        }

    and set the Chart.ItemsSource = viewModel.Series, how can I get a line chart to draw each series as a line and show in the legend as the series Name?
  2. Yavor
    Admin
    Yavor avatar
    11 posts

    Posted 19 Jan 2011 Link to this post

    Hi Brendan,

    You can use a DataContext, to pass the data from the ViewModel to the chart control. A very similar sample is demonstrated in the following location:

    http://demos.telerik.com/silverlight/#Chart/MVVM

    I hope this gets you started properly.

    Regards,
    Yavor
    the Telerik team
    Let us know about your Windows Phone 7 application built with RadControls and we will help you promote it. Learn more>>
  3. Brendan
    Brendan avatar
    34 posts
    Member since:
    Oct 2010

    Posted 19 Jan 2011 Link to this post

    Sorry you misunderstand, my question is not about simply binding the charts itemsource, it is about binding to a collection of objects as series each with they're own collection of values. Your given example has only the top level collection in ViewModel, not the child collection of values within the Series class.

    The only way I've managed to do it so far is to convert into a nested collection and use a converter to create my series mappings using collectionIndex. I would rather use the original objects rather than have to convert to nested collection.
  4. Yavor
    Admin
    Yavor avatar
    11 posts

    Posted 25 Jan 2011 Link to this post

    Hi Brendan,

    Indeed, in such a case you would need to convert the underlying datasource, and use the collection index to properly bind the control.

    Regards,
    Yavor
    the Telerik team
    Let us know about your Windows Phone 7 application built with RadControls and we will help you promote it. Learn more>>
  5. Jurie
    Jurie avatar
    6 posts
    Member since:
    Feb 2009

    Posted 27 Jan 2011 Link to this post

    Hi,

    Is it possible to provide an example off how to accomplish this.

    I am experiencing the exact same problem , what I am trying to achieve is the following:

    Dataobjects:
    public class StudyData
    {
        private List<StudyItem> _items;
        public List<StudyItem> Items
        {
            get { return _items ?? (_items = new List<StudyItem>()); }
            set { _items = value; }
        }
     
        public string ItemName { get; set; }
    }
     
    public class StudyItem
    {
        public DateTime Date { get; set; }
     
        public double Value { get; set; }
    }

    Property in ViewModel:
    private ObservableCollection<StudyData> _studyData;
     
    public ObservableCollection<StudyData> StudyData
    {
        get
        {
            return _studyData ?? (_studyData = new ObservableCollection<StudyData>());
        }
        set
        {
            if (_studyData == value) return;
     
            _studyData = value;
            RaisePropertyChanged("StudyData");
        }
    }

    and then I'd like to do something like the following in xaml:
    <telerik:RadChart ItemsSource="{Binding StudyData}"/>
    with each StudyData object being represented as a seperate series.
  6. Jurie
    Jurie avatar
    6 posts
    Member since:
    Feb 2009

    Posted 27 Jan 2011 Link to this post

    see
    http://www.telerik.com/community/forums/silverlight/chart/possible-to-bind-to-seriesmapping.aspx

    which is another attempt at achieving the same result, but which doesn't work due to the chart throwing exceptions.
  7. Jurie
    Jurie avatar
    6 posts
    Member since:
    Feb 2009

    Posted 27 Jan 2011 Link to this post

    Just for in case someone else tries accomplishing the same thing:

    Binding the seriesmappings is futile(read: bugged). Instead, make use of groupingsettings, and adjust your collection manually in a converter - like this:

    <telerik:RadChart ItemsSource="{Binding StudyData, Converter={StaticResource SourceDataConverter}}" >
          <telerik:RadChart.SeriesMappings>
              <telerik:SeriesMapping>
                  <telerik:SeriesMapping.SeriesDefinition>
                      <telerik:BarSeriesDefinition />
                  </telerik:SeriesMapping.SeriesDefinition>
                  <telerik:SeriesMapping.GroupingSettings>
                      <telerik:GroupingSettings ShouldCreateSeriesForLastGroup="True">
                          <telerik:GroupingSettings.GroupDescriptors>
                              <telerik:ChartGroupDescriptor Member="ItemName"/>
                          </telerik:GroupingSettings.GroupDescriptors>
                      </telerik:GroupingSettings>
                  </telerik:SeriesMapping.GroupingSettings>
                  <telerik:SeriesMapping.ItemMappings>
                      <telerik:ItemMapping FieldName="Value" DataPointMember="YValue" />
                      <telerik:ItemMapping FieldName="Date" DataPointMember="XCategory" />
                  </telerik:SeriesMapping.ItemMappings>
              </telerik:SeriesMapping>
          </telerik:RadChart.SeriesMappings>
          <telerik:RadChart.DefaultView>
              <telerik:ChartDefaultView ChartLegendPosition="Bottom">                  
                  <telerik:ChartDefaultView.ChartTitle>
                      <telerik:ChartTitle HorizontalContentAlignment="Stretch" Content="Item values"/>
                  </telerik:ChartDefaultView.ChartTitle>
                  <telerik:ChartDefaultView.ChartLegend>
                      <telerik:ChartLegend x:Name="chartLegend"/>
                  </telerik:ChartDefaultView.ChartLegend>
                  <telerik:ChartDefaultView.ChartArea>
                      <telerik:ChartArea x:Name="chartArea" LegendName="chartLegend" EnableAnimations="True">
                          <telerik:ChartArea.AxisX>
                              <telerik:AxisX LayoutMode="Inside"  IsDateTime="True" DefaultLabelFormat="MM yyy" AutoRange="True"
                                                                 LabelRotationAngle="60" LabelStep="1" TicksDistance="15"/>
                          </telerik:ChartArea.AxisX>
                      </telerik:ChartArea>
                  </telerik:ChartDefaultView.ChartArea>
              </telerik:ChartDefaultView>
          </telerik:RadChart.DefaultView>
      </telerik:RadChart>

    Converter:
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        IList<StudyData> data = value as Collection<StudyData>;
     
        if (data == null || data.Count == 0) return null;
     
        IList<StudyItem> items = new List<StudyItem>();
     
        data.ToList().ForEach(study => study.Items.ForEach(item =>
                                                               {
                                                                   item.ItemName = study.ItemName;
                                                                   items.Add(item);
                                                               }));
     
        return items;
    }

  8. Giuseppe
    Admin
    Giuseppe avatar
    2363 posts

    Posted 28 Jan 2011 Link to this post

    Hello Jurie,

    Find attached a sample application that demonstrates RadChart.SeriesMappings bindings.

    Should your problem persist, please open a formal support ticket and send us a runnable sample application that we can investigate locally and advise you how to proceed.


    Best wishes,
    Giuseppe
    the Telerik team
    Let us know about your Windows Phone 7 application built with RadControls and we will help you promote it. Learn more>>
  9. Jurie
    Jurie avatar
    6 posts
    Member since:
    Feb 2009

    Posted 28 Jan 2011 Link to this post

    Thank you very much!

    So returning your series in a SeriesMappingCollection was the missing link.

    Very much appreciated.
  10. müller
    müller avatar
    3 posts
    Member since:
    Aug 2010

    Posted 04 May 2011 Link to this post

    Hi,

    your example doesn't show the LegendLabel.

    Why? 

Back to Top