This is a migrated thread and some comments may be shown as answers.

Bug in RadCartesianChart Multiple Y Axis, or am I using it wrong?

3 Answers 233 Views

ChartView

This is a migrated thread and some comments may be shown as answers.

This question is locked. New answers and comments are not allowed.

Alasdair asked on 23 Mar 2012, 10:05 AM

Hello again,

I have a problem where we need to have two Vertical Axis on our RadCartesianChart and Multiple lines that can be added or removed on the fly. The issue I am seeing is if I have two line series assigned to my Second Y Axis updating nicely and then I want to remove one line from the RadCartesianChart by using something like " xChart.Series.RemoveAt(0);" it seems that the whole Y axis gets removed.

I've included some simple code below, if you hit the delete button you'll see what I mean. Is this an issue with RadCartesianChart Multiple Y Axis or am I just using it incorrectly?

Many Thanks,
Alasdair

MainPage.xaml.cs:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using Telerik.Windows.Controls.ChartView;
using System.Threading;
using System.Collections.ObjectModel;

namespace BugExample
{
    public partial class MainPage : UserControl
    {
        ObservableCollection<Data> line1;
        public ObservableCollection<Data> Line1
        {
            get { return line1; }
            set { line1 = value; }
        }

        ObservableCollection<Data> line2;
        public ObservableCollection<Data> Line2
        {
            get { return line2; }
            set { line2 = value; }
        }

        ObservableCollection<Data> line3;
        public ObservableCollection<Data> Line3
        {
            get { return line3; }
            set { line3 = value; }
        }

        LinearAxis Axis2;
        Thread AddThread;
        Thread Add3Thread;

        public MainPage()
        {
            InitializeComponent();

            Line1 = new ObservableCollection<Data>();
            Line2 = new ObservableCollection<Data>();


            for (int i = 0; i < 4; i++)
            {
                Line1.Add(new Data(DateTime.Now.AddHours(i), i));
            }

            for (int i = 0; i < 4; i++)
            {
                Line2.Add(new Data(DateTime.Now.AddHours(i), i * 2));
            }


            // We Create a new Y Axis.
            Axis2 = new LinearAxis();

            Axis2.HorizontalLocation = Telerik.Charting.AxisHorizontalLocation.Right;
            Axis2.Title = "RightValue";

            this.Loaded += new RoutedEventHandler(MainPage_Loaded);

        }

        void MainPage_Loaded(object sender, RoutedEventArgs e)
        {
            LineSeries ls1 = new LineSeries();
            LineSeries ls2 = new LineSeries();

            ls1.VerticalAxis = Axis2;
            ls1.CategoryBinding = new PropertyNameDataPointBinding("Time");
            ls1.ValueBinding = new PropertyNameDataPointBinding("Value");
            ls1.ItemsSource = Line1;
            xChart.Series.Add(ls1);

            ls2.VerticalAxis = Axis2;
            ls2.CategoryBinding = new PropertyNameDataPointBinding("Time");
            ls2.ValueBinding = new PropertyNameDataPointBinding("Value");
            ls2.ItemsSource = Line2;
            ls2.Stroke = new SolidColorBrush(Colors.Red);
            xChart.Series.Add(ls2);

            AddThread = new Thread(new ThreadStart(this.AddValueThread));
            AddThread.Start();
        }

        public void AddValueThread()
        {
            while (true)
            {
                Random rand = new Random((int) DateTime.Now.Ticks);

                Line1.Add(new Data(DateTime.Now.AddHours(line1.Count + 1), rand.Next(0, 100) * 1));
                Line2.Add(new Data(DateTime.Now.AddHours(line2.Count + 1), rand.Next(0, 100) * 2));
                System.Threading.Thread.Sleep(1000);
            }
        }

        /// <summary>
        /// We remove the first item.
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        private void DeleteTrend_Click(object sender, RoutedEventArgs e)
        {
            xChart.Series.RemoveAt(0);
        }

        /// <summary>
        /// Add a new trend to the Second Y Axis.
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        private void AddTrend_Click(object sender, RoutedEventArgs e)
        {
            Button b = sender as Button;

            LineSeries ls3 = new LineSeries();
            Line3 = new ObservableCollection<Data>();

            for (int i = 0; i < 4; i++)
            {
                Line3.Add(new Data(DateTime.Now.AddHours(i), i * 3));
            }

            ls3.VerticalAxis = Axis2;
            ls3.CategoryBinding = new PropertyNameDataPointBinding("Time");
            ls3.ValueBinding = new PropertyNameDataPointBinding("Value");
            ls3.ItemsSource = Line3;
            ls3.Stroke = new SolidColorBrush(Colors.Green);
            xChart.Series.Add(ls3);

            Add3Thread = new Thread(new ThreadStart(this.AddValue3Thread));

            Add3Thread.Start();

            b.IsEnabled = false;
        }

        public void AddValue3Thread()
        {
            while (true)
            {
                Random rand = new Random((int)DateTime.Now.Ticks);

                Line3.Add(new Data(DateTime.Now.AddHours(line3.Count + 1), rand.Next(0, 100) * 3));

                System.Threading.Thread.Sleep(1000);
            }
        }

    }

    public class Data
    {
        public DateTime Time { get; set; }
        public int Value { get; set; }

        public Data(DateTime time, int value)
        {
            Time = time;
            Value = value;
        }
    }
}

MainPage.xml:

<UserControl x:Class="BugExample.MainPage"
       xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
       xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
       xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
       xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
       xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
       mc:Ignorable="d" d:DesignWidth="640" d:DesignHeight="480">
   <Grid x:Name="LayoutRoot">

        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition Height="52"/>
        </Grid.RowDefinitions>

        <telerik:RadCartesianChart x:Name="xChart" Grid.Row="0" >

            <telerik:RadCartesianChart.HorizontalAxis>
                <telerik:DateTimeContinuousAxis Title="DateTime" />
            </telerik:RadCartesianChart.HorizontalAxis>

            

        </telerik:RadCartesianChart>

        <Button Name="DeleteTrend" Click="DeleteTrend_Click" Grid.Row="1" Width="44" Content="Delete" HorizontalAlignment="Right"/>
        <Button Name="AddTrend" Click="AddTrend_Click" Grid.Row="1" Width="44" Content="Add" HorizontalAlignment="Left"/>

   </Grid>
</UserControl>

3 Answers, 1 is accepted

answered on 18 Jul 2012, 10:03 PM

I'm having a similar problem with using multiple axes. When all the series are removed from an axis, the axis becomes unusable for adding more series. To get around this problem, I would make a new axis whenever all the items were removed from the old one.

Now, we want to have strip lines from the ChartGrid show up. With the above solution, I was not adding the axes to the chart, so the ChartGrid was not showing the strip lines.

To associate the axis with the chart, I added this line to set the chart's vertical axis to the newly created axis. This works until all the series have been removed from that axis and a new LinearAxis is created the 2nd time through.

// If everything was removed from the axis; it doesn't work anymore, so make a new one

if (_LeftSeriesIDs.Count == 0) {

_LeftAxis = new LinearAxis();

_Chart.VerticalAxis = _LeftAxis; // Causes null reference exception the 2nd time through

}

AreaSeries series = new AreaSeries() {

// Set some irrelevant stuff here

VerticalAxis =

(Location == Telerik.Charting.AxisHorizontalLocation.Left) ? _LeftAxis : _RightAxis,

};

_Chart.Series.Add(series);

Am I doing anything wrong with this, or is does reassigning a chart's vertical axis cause a null reference exception?

Is there something other than making a new axis that will get the old one to continue working?

Thanks