Updating Range Bar Series chart without calling rebind() and/or doing remove/insert to ItemsSource

4 posts, 0 answers
  1. Ruby Jean
    Ruby Jean avatar
    9 posts
    Member since:
    Jun 2012

    Posted 02 Nov 2012 Link to this post

    Hi,

    We have a current requirement to be able to update the High/Low values of a range bar series chart based on user input (from text box). I was able to update the data point but the bar, displayed in the chart was not updated. I was able to find a workaround by updating the data point values (High/Low) then removing the data point of the bar from the items source and inserting it again. Another workaround I found is calling the radchart.rebind() after updating the data point values.

    There is also the same requirement for a line series (with point mark) and it works grand by just updating the data point (XValue, YValue) values. The point mark is displayed in a correct location after update.

    Could you advise me on how I should go about on this.

    Any help is greatly appreciated.

    Cheers,
    Byang Fernando

  2. Petar Kirov
    Admin
    Petar Kirov avatar
    425 posts

    Posted 07 Nov 2012 Link to this post

    Hi Byang,

    The reason that the chart does not update when a data item gets changed is that nobody notifies it. By implementing the INotifyPropertyChanged interface in your business class the chart will be able to detect changes in the individual items of the ItemSource. Here is an example of such class:
     
    public class ChartData : INotifyPropertyChanged
    {
        private double value;
        private string category;
     
        public double Value
        {
            get
            {
                return this.value;
            }
            set
            {
                if (this.value != value)
                {
                    this.value = value;
                    this.OnPropertyChanged(
                        new PropertyChangedEventArgs("Value"));
                }
            }
        }
     
        public string Category
        {
            get
            {
                return this.category;
            }
            set
            {
                if (this.category != value)
                {
                    this.category = value;
                    this.OnPropertyChanged(
                        new PropertyChangedEventArgs("Category"));
                }
            }
        }
     
        public event PropertyChangedEventHandler PropertyChanged;
     
        protected virtual void OnPropertyChanged(PropertyChangedEventArgs args)
        {
            if (this.PropertyChanged != null)
            {
                this.PropertyChanged(this, args);
            }
        }
    }

    If you have any further questions feel free to ask.
     
    Regards,
    Petar Kirov
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

  3. DevCraft banner
  4. Ruby Jean
    Ruby Jean avatar
    9 posts
    Member since:
    Jun 2012

    Posted 07 Nov 2012 Link to this post

    Hi Petar,

    Thanks for that reply. However, I have that covered in my business class already as follows:
    public class StlChartData : INotifyPropertyChanged
        {
            private double? _xValue;
            public double? XValue
            {
                get { return _xValue; }
                set
                {
                    if (_xValue != value)
                    {
                        _xValue = value;
                        this.OnPropertyChanged(new PropertyChangedEventArgs("XValue"));
                    }
                }
            }
     
            private double? _yValue;
            public double? YValue
            {
                get { return _yValue; }
                set
                {
                    if (_yValue != value)
                    {
                        _yValue = value;
                        this.OnPropertyChanged(new PropertyChangedEventArgs("YValue"));
                    }
                }
            }
     
            private double _high;
            public double High
            {
                get { return _high; }
                set
                {
                    if (_high != value && value > _low)
                    {
                        _high = value;
                        this.OnPropertyChanged(new PropertyChangedEventArgs("High"));
                    }
                }
            }
     
            private double _low;
            public double Low
            {
                get { return _low; }
                set
                {
                    if (_low != value && value < _high)
                    {
                        _low = value;
                        this.OnPropertyChanged(new PropertyChangedEventArgs("Low"));
                    }
                }
            }
             
     
            public event PropertyChangedEventHandler PropertyChanged;
            protected virtual void OnPropertyChanged(PropertyChangedEventArgs args)
            {
                if (this.PropertyChanged != null)
                {
                    this.PropertyChanged(this, args);
                }
            }
        }

    And mapped data as follows:
    RadHierarchicalObservableCollection<StlChartData> rangeData = new RadHierarchicalObservableCollection<StlChartData>();
    rangeData.Add(new StlChartData() { XValue = 0, High = 3, Low = 1 });
    rangeData.Add(new StlChartData() { XValue = 1, High = 4, Low = 2 });
     
    RangeBarSeriesDefinition rangeDef = new RangeBarSeriesDefinition();
    rangeDef.ShowItemLabels = true;
    rangeDef.Appearance.StrokeThickness = 2;
    rangeDef.Appearance.Stroke = new SolidColorBrush(Colors.Black);
    rangeDef.Appearance.PointMark.Stroke = new SolidColorBrush(Colors.Black);
    rangeDef.Appearance.PointMark.StrokeThickness = 2;
    rangeDef.ShowItemLabels = false;
    rangeDef.ItemStyle = ChartGrid.Resources["RangeBarStyle"] as Style;
     
    SeriesMapping rangeMapping = new SeriesMapping();
    rangeMapping.SeriesDefinition = rangeDef;
    rangeMapping.ItemsSource = rangeData;
    rangeMapping.ItemMappings.Add(new ItemMapping("High", DataPointMember.High));
    rangeMapping.ItemMappings.Add(new ItemMapping("Low", DataPointMember.Low));
    rangeMapping.ItemMappings.Add(new ItemMapping("XValue", DataPointMember.XValue));
     
    RadChart1.SeriesMappings.Add(rangeMapping);

    And my text changed event as follows:
    private void TextBox_TextChanged(object sender, TextChangedEventArgs e)
    {
        (RadChart.SeriesMappings[0].ItemsSource as RadHierarchicalObservableCollection<StlChartData>)[0].High = double.Parse((sender as TextBox).Text);
        RadChart.Rebind();
    }

    Notice the line RadChart.Rebind(), I have to do that to reflect the change made on the High property. If I removed that piece of code, nothing happens to the chart.

    Did I miss anything? As I mentioned in my previous post, I did the same thing on a line series but I don't need to call RadChart.Rebind() to change the position of the point mark.

    I hope you can help me on this. Thanks in advance.

    Cheers,
    Byang Fernando


  5. Petar Marchev
    Admin
    Petar Marchev avatar
    968 posts

    Posted 08 Nov 2012 Link to this post

    Hello Ruby,

    Thanks for the attached code snippets. We were able to find a bug in the control. I have logged it as such in our PITS where you can vote and track its status. I think the fix will be available for the next service pack (scheduled for the end of this month). I have updated your Telerik points as a small sign of gratitude for bringing this issue to our attention and helping us improve our products!

    Kind regards,
    Petar Marchev
    the Telerik team

    Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

Back to Top