Ludde
Ludde

Reputation: 77

WPF: Problems with DataContext and ViewModel

I'm having a problem getting the content to display in my program, and I suspect I messed up something relating to the DataContext. The controls I am using come from an extension called Syncfusion (to display graphs) but it could be any other control displaying these items.

MainWindow.xaml.cs:

       public MainWindow()
    {
        InitializeComponent();
        ViewModel _viewModel = new ViewModel();
        DataContext = _viewModel;
    }

ViewModel.cs

    public class ViewModel
{
    public ObservableCollection<TotalData> TotalDataColl { get; set; }

    public ViewModel()
    {
        TotalDataColl = new ObservableCollection<TotalData>();
        var vm = new ChartViewModel
        {
            Series = new ObservableCollection<SeriesViewModel>
            {
                new SeriesViewModel{type="Lemons", Items = new ObservableCollection<ItemViewModel>{new ItemViewModel{source = "January", value = 25}, new ItemViewModel{source = "February", value = 35}}},
                new SeriesViewModel{type="Oranges",Items = new ObservableCollection<ItemViewModel>{new ItemViewModel{source = "January", value = 22}, new ItemViewModel{source = "February", value = 36}}}
            }

        };
    }

}

MainWindow.xaml

    <Grid>
    <local:ExtendedChart ItemsSource="{Binding Series}" Margin="0,-38,0,97">
        <local:ExtendedChart.ItemTemplate>
            <DataTemplate>
                <chart:ColumnSeries ItemsSource="{Binding Items}" DependentValuePath="value" IndependentValuePath="source" Title="{Binding type}" />
            </DataTemplate>
        </local:ExtendedChart.ItemTemplate>
    </local:ExtendedChart>
</Grid>

DataClass.cs

public class ChartViewModel : ObservableObject
{
    private ObservableCollection<SeriesViewModel> _series;
    public ObservableCollection<SeriesViewModel> Series
    {
        get
        {
            return _series;
        }
        set
        {
            _series = value;
            OnPropertyChanged("Series");
        }
    }
}

public class SeriesViewModel : ObservableObject
{
    private ObservableCollection<ItemViewModel> items;
    private string _type;
    public string type { get { return _type; } set { _type = value; OnPropertyChanged("_type"); } }
    public ObservableCollection<ItemViewModel> Items { get { return items; } set { items = value; OnPropertyChanged("Items"); } }
}

public class ItemViewModel : ObservableObject
{
    private string _source;
    private double _value;
    public string Source { get { return _source;} set { _source = value; OnPropertyChanged("Source"); } }

    public double Value { get { return _value; } set { _value = value;OnPropertyChanged("Value"); } }
}

Upvotes: 0

Views: 221

Answers (1)

Sushil Mate
Sushil Mate

Reputation: 583

ViewModel

   public class ViewModel
   {
    public ObservableCollection<TotalData> TotalDataColl { get; set; }
    public ChartViewModel ChartSeriesViewModel { get; set; }
    public ViewModel()
    {
        TotalDataColl = new ObservableCollection<TotalData>();
        ChartSeriesViewModel = new ChartViewModel
        {
            Series = new ObservableCollection<SeriesViewModel>
            {
                new SeriesViewModel{type="Lemons", Items = new ObservableCollection<ItemViewModel>{new ItemViewModel{source = "January", value = 25}, new ItemViewModel{source = "February", value = 35}}},
                new SeriesViewModel{type="Oranges",Items = new ObservableCollection<ItemViewModel>{new ItemViewModel{source = "January", value = 22}, new ItemViewModel{source = "February", value = 36}}}
            }

        };
    }

}

MainWindow.Xaml

<Grid>
    <local:ExtendedChart ItemsSource="{Binding ChartSeriesViewModel.Series}" Margin="0,-38,0,97">
        <local:ExtendedChart.ItemTemplate>
            <DataTemplate>
                <chart:ColumnSeries ItemsSource="{Binding Items}" DependentValuePath="value" IndependentValuePath="source" Title="{Binding type}" />
            </DataTemplate>
        </local:ExtendedChart.ItemTemplate>
    </local:ExtendedChart>
</Grid>

Upvotes: 1

Related Questions