How to bind ObservableDictionary to ChartView?

3 posts, 1 answers
  1. JackSH
    JackSH avatar
    8 posts
    Member since:
    Apr 2013

    Posted 12 May 2014 Link to this post

    I try, but not works:

    <chartView:BarSeries CategoryBinding="{Binding Path=Value.Price}"
                         ItemsSource="{Binding RecordsSorted}"
                         ValueBinding="{Binding Path=Value.Count}">
            <telerik:SeriesLegendSettings />
  2. Answer
    Martin avatar
    1042 posts

    Posted 13 May 2014 Link to this post

    Hello Jack,

    Note that when you set the ValueBinding and CategoryBinding properties in Xaml they will expect strings with a valid property name. For example:
    <telerik:LineSeries CategoryBinding="Price"
                  ItemsSource="{Binding RecordsSorted}"/>
    When you bind them like in the provided code snippet you are passing them the numbers contained in the Price and Count properties which are not valid property names.

    However, the above code snippet won't work in your scenario. Instead of this you can create the value and category bindings in code-behind. The RadChartView has two data-binding mechanisms: PropertyNameDataPointBinding and GenericDataPointBinding. These two classes derive from the DataPointBinding base class. In order to bind correctly the values from your Dictionary you can use the GenericDataPointBinding. Here is an example in code:
    this.series.ValueBinding = new GenericDataPointBinding<KeyValuePair<string, DataItem>, double>
        ValueSelector = (item) => item.Value.Count
    this.series.CategoryBinding = new GenericDataPointBinding<KeyValuePair<string, DataItem>, double>
        ValueSelector = (item) => item.Value.Price
    <telerik:BarSeries Name="series" ItemsSource="{Binding RecordsSorted}" />
    The KeyValuePair<string, DataItem> is the record from your dictionary and double is the type that should be passed to the series.

    In addition I prepared a small project demonstrating this approach. Please give it a try and let me know if I am missing something.

    Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
  3. DevCraft R3 2016 release webinar banner
  4. JackSH
    JackSH avatar
    8 posts
    Member since:
    Apr 2013

    Posted 14 May 2014 in reply to Martin Link to this post

    Martin, Many thanks for the explanation and example, everything works.
Back to Top