dynamic barseries with MVVM

[Asti]

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.

[Nikolay]

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

[Asti]

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 { get; set; }
            public double Value1 { get; set; }
  
            public double Value2 { get; set; }
            public double Value3 { get; set; }
  
            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);
            }
        }

[Nikolay]

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

[Asti]

Hi I do not see the MVVM pattern being followed in the attached sample?

[Nikolay]

Hi,

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

All the best,
Nikolay
the Telerik team