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 184 Views
ChartView
This is a migrated thread and some comments may be shown as answers.
Alasdair
Top achievements
Rank 1
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.VerticalAxis>
                <telerik:LinearAxis Title="Value" />
            </telerik:RadCartesianChart.VerticalAxis>
            -->
            
        </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

Sort by
0
Nikolay
Telerik team
answered on 27 Mar 2012, 08:20 AM
Hi Alasdair,

You've encountered an issue present in the 2012.1.215 version, which has already been fixed. Please, download our 2012 Q1 Service Pack 1, released yesterday, and give it a try - the chart should behave as expected in the described scenario.

Kind regards,
Nikolay
the Telerik team
Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
0
Chris
Top achievements
Rank 1
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
0
Nikolay
Telerik team
answered on 23 Jul 2012, 07:44 AM
Hello Chris,

Could you, please, open a support ticket and send us a sample test application, which demonstrates your scenario, as we've been unable to reproduce this issue locally, so perhaps we are missing some of the details. Any additional information would be appreciated as well.

All the best,
Nikolay
the Telerik team

Explore the entire Telerik portfolio by downloading Telerik DevCraft Ultimate.

Tags
ChartView
Asked by
Alasdair
Top achievements
Rank 1
Answers by
Nikolay
Telerik team
Chris
Top achievements
Rank 1
Share this question
or