Simple Bar Chart with WPF Toolkit?

Question

I've tried to follow this example for a simple bar chart with MVVM:

Code Project MVVM Charting

But cannot get any chart to display. Here is my view model which exposes a KeyValuePair ObservableCollection :

 private ObservableCollection<KeyValuePair<string, int>> _ChartParametersPairedObservableList;
    public ObservableCollection<KeyValuePair<string, int>> ChartParametersPairedObservableList
    {
        get { return _ChartParametersPairedObservableList; }
        set
        {
            _ChartParametersPairedObservableList = value;
            OnPropertyChanged("ChartParametersPairedObservableList");
        }
    }

and instantiates/populates the collection from another ObservableCollection :

private void GetChartParametersAndBuildKeyValuePairs()
    {
        ChartParametersObservableList = new ObservableCollection<ChartParameters>(IsesService.GetChartParameters(Country, ArticleType));
        ChartParametersPairedObservableList = new ObservableCollection<KeyValuePair<string, int>>();

        foreach (var item in ChartParametersObservableList)
        {              
            ChartParametersPairedObservableList.Add(new KeyValuePair<string, int>(item.operator_name_abrv, item.countAll));
        }
    }

This collection works as expected. I know property changed is working as I can bind a DataGrid to the collection from the view no problem. The issue is when I try to bind to a chart.

Here is my view Xaml for the chart:

xmlns:DVC="clr-namespace:System.Windows.Controls.DataVisualization.Charting;assembly=System.Windows.Controls.DataVisualization.Toolkit"

<DVC:Chart Canvas.Top="80" Canvas.Left="10" ItemsSource="{Binding ChartParametersPairedObservableList}" Width="400" Height="250">
            <DVC:Chart.Series>
                <DVC:BarSeries ItemsSource="{Binding ChartParametersPairedObservableList}"
                               IndependentValueBinding="{Binding Path=Key}" 
                               DependentValueBinding="{Binding Path=Value}">
                    </DVC:BarSeries>
            </DVC:Chart.Series>
            </DVC:Chart>

Unfortunately, I don't get any data output in my chart at run time. I'm getting binding errors in the output window. Can't bind to the value & key:

BindingExpression path error: 'Key' property not found on 'object'
BindingExpression path error: 'Value' property not found on 'object'

What Am I doing wrong?

Answer 1

Solved this by using Modern UI (Metro) Charts for Windows 8, WPF, Silverlight.

modernuicharts

Great library & modern look, no more Windows 95 styling!