dynamic barseries with MVVM

6 posts, 0 answers
  1. Asti
    Asti avatar
    12 posts
    Member since:
    Dec 2007

    Posted 16 Jan 2013 Link to this post

    Hi,

    I've looked at the demos of the ChartView control on how to create a bar chart and noticed that each bar is defined in xaml and bound to data. 

    In my case the bars aren't known until runtime, so my question is how can one dynamically add barseries to a Chartview using MVVM ?

    My data is defined as such:

    class BarData // Represents one "item" on the x-axis
     
    {
    DateTime Date {get; set;} // X-Axis, works fine
     
    Dictionary<string,double> Items = new Dictionary <string, double> ();  // string is the name of the category, and double is the value
     
    }

    I'm not sure if this is the best way to represent data for creating the Chart and I'm open to feedback for this.
  2. Nikolay
    Admin
    Nikolay avatar
    385 posts

    Posted 18 Jan 2013 Link to this post

    Hello,

    Please, have a look at this forum post - it describes a similar scenario, the only difference being that the series type is StackedBar, instead of Bar, and there is also a sample code snippet demonstrating how to bind data from a view model.

    Regards,
    Nikolay
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  3. UI for WPF is Visual Studio 2017 Ready
  4. Asti
    Asti avatar
    12 posts
    Member since:
    Dec 2007

    Posted 18 Jan 2013 Link to this post

    Hi , i tried out the samples and got it almost working, the categories show fine, the y-axis scales properly the legend displays but the bars themselves are not appearing. 

    What could be causing this?

    <controls:RadChart SeriesMappings="{Binding SeriesMapping}" ItemsSource="{Binding SampleData, Mode=TwoWay}">
             
        </controls:RadChart>


    public SeriesMappingCollection SeriesMapping
          {
              get { return _seriesMapping; }
              set
              {
                  if (Equals(value, _seriesMapping)) return;
                  _seriesMapping = value;
                  NotifyOfPropertyChange(() => SeriesMapping);
              }
          }

      public class Company
            {
                public string Name { getset; }
                public double Value1 { getset; }
      
                public double Value2 { getset; }
                public double Value3 { getset; }
      
                public Company(string name, double value1, double value2, double value3)
                {
                    Name = name;
                    Value1 = value1;
                    Value2 = value2;
                    Value3 = value3;
                }
            }


    inside viewmodel ctor: 
    {
     SampleData = new List<Company>();
                SampleData.Add(new Company("Physical", 100, 400, 300));
                SampleData.Add(new Company("Virtualized", 600, 200, 240));
     
                SeriesMapping seriesMapping = new SeriesMapping { LegendLabel = "Series 1" };
                seriesMapping.ItemMappings.Add(new ItemMapping("Value1"DataPointMember.YValue));
                seriesMapping.ItemMappings.Add(new ItemMapping("Name"DataPointMember.XCategory));
                seriesMapping.SeriesDefinition = new StackedBarSeriesDefinition() { ShowItemLabels = true };
                
     
                SeriesMapping seriesMapping2 = new SeriesMapping { LegendLabel = "Series 2" };
                seriesMapping2.ItemMappings.Add(new ItemMapping("Value2"DataPointMember.YValue));
                seriesMapping2.ItemMappings.Add(new ItemMapping("Name"DataPointMember.XCategory));
                seriesMapping2.SeriesDefinition = new StackedBarSeriesDefinition() { ShowItemLabels = true, Appearance = new SeriesAppearanceSettings{ Fill = new SolidColorBrush(Colors.Yellow), Foreground = new SolidColorBrush(Colors.Green)}};
     
                SeriesMapping seriesMapping3 = new SeriesMapping { LegendLabel = "Series 3" };
                seriesMapping3.ItemMappings.Add(new ItemMapping("Value3"DataPointMember.YValue));
                seriesMapping3.ItemMappings.Add(new ItemMapping("Name"DataPointMember.XCategory));
                seriesMapping3.SeriesDefinition = new StackedBarSeriesDefinition() { ShowItemLabels = true };
                
      
                this.SeriesMapping.Add(seriesMapping);
                this.SeriesMapping.Add(seriesMapping2);
                this.SeriesMapping.Add(seriesMapping3);

    }

      public List<Company> SampleData
            {
                get { return _sampleData; }
                set
                {
                    if (Equals(value, _sampleData)) return;
                    _sampleData = value;
                    NotifyOfPropertyChange(() => SampleData);
                }
            }

  5. Nikolay
    Admin
    Nikolay avatar
    385 posts

    Posted 22 Jan 2013 Link to this post

    Hello,

    Please, excuse us for the misunderstanding - the chart samples in the forum post are for the RadChart control, whereas you have asked about the RadChartView control. Please, find attached a sample test application, which demonstrates how you can create StackedBar series dynamically using RadChartView for WPF.

    Regards,
    Nikolay
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  6. Asti
    Asti avatar
    12 posts
    Member since:
    Dec 2007

    Posted 22 Jan 2013 Link to this post

    Hi I do not see the MVVM pattern being followed in the attached sample?
  7. Nikolay
    Admin
    Nikolay avatar
    385 posts

    Posted 24 Jan 2013 Link to this post

    Hi,

    Please, find attached an updated version of the sample app.

    All the best,
    Nikolay
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

Back to Top
UI for WPF is Visual Studio 2017 Ready