Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
70
Series is not displayed if the elements of the collection are not exactly the same as the CategoryDateTimeXAxis
posted

I am having the following problem: I have a chart with two series and a time axis. The series are bound to collections of objects where one of the properties is DateTime. The CategoryDateTimeXAxis is bound to a third collection of DateTime instances.

If the two series have exactly the same number of elements, with the same values, as the X axis, everything works. However, if the axis has a different number of elements, the series are not displayed. If one of the collections has fewer elements, it is not displayed.

In short, unless the axis collection and the series collections line up exactly, the series are not displayed.

My expectation would be that the chart control lines up the data points in each series with the axis by comparing DateTime values. This does not appear to be happening.

I have set up the test project below. The first chart has the exact same elements in all 3 collections (DateTime values at 1 minute intervals). The second chart has the date axis bound to a collection with twice as many elements as the series (DateTime values at 30 second intervals). On the second chart nothing is displayed.

As an additional test, when I remove one element from one of the series, that series disappears from the chart:

Items2.RemoveAt(0);

Here is my code:

XAML:

<Window
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:ig="http://schemas.infragistics.com/xaml" x:Class="XamDataChartTest.MainWindow"
        Title="MainWindow" Height="500" Width="500"
        DataContext="{Binding RelativeSource={RelativeSource Self}}"
        >
    <Grid>
        <StackPanel>
            <ig:XamDataChart HorizontalAlignment="Stretch" Height="220">
                <ig:XamDataChart.Axes>
                    <ig:CategoryDateTimeXAxis x:Name="xAxis1" DateTimeMemberPath="." ItemsSource="{Binding TimesMinutes}" Label="{}{:HH:mm}"/>
                    <ig:NumericYAxis x:Name="yAxis1"/>
                </ig:XamDataChart.Axes>
                <ig:XamDataChart.Series>
                    <ig:LineSeries XAxis="{Binding ElementName=xAxis1}" YAxis="{Binding ElementName=yAxis1}" ItemsSource="{Binding Items1}" ValueMemberPath="Value"/>
                    <ig:LineSeries XAxis="{Binding ElementName=xAxis1}" YAxis="{Binding ElementName=yAxis1}" ItemsSource="{Binding Items2}" ValueMemberPath="Value"/>
                </ig:XamDataChart.Series>
            </ig:XamDataChart>
            <ig:XamDataChart HorizontalAlignment="Stretch" Height="220">
                <ig:XamDataChart.Axes>
                    <ig:CategoryDateTimeXAxis x:Name="xAxis2" DateTimeMemberPath="." ItemsSource="{Binding TimesSeconds}" Label="{}{:HH:mm}"/>
                    <ig:NumericYAxis x:Name="yAxis2"/>
                </ig:XamDataChart.Axes>
                <ig:XamDataChart.Series>
                    <ig:LineSeries XAxis="{Binding ElementName=xAxis2}" YAxis="{Binding ElementName=yAxis2}" ItemsSource="{Binding Items1}" ValueMemberPath="Value"/>
                    <ig:LineSeries XAxis="{Binding ElementName=xAxis2}" YAxis="{Binding ElementName=yAxis2}" ItemsSource="{Binding Items2}" ValueMemberPath="Value"/>
                </ig:XamDataChart.Series>
            </ig:XamDataChart>        
        </StackPanel>
    </Grid>
</Window>

Code-behind:

using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
namespace XamDataChartTest
{
    public class Item
    {
        public DateTime Time { get; set; }
        public double Value { get; set; }
    }
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            for (var time = DateTime.Now; time < DateTime.Now.AddHours(12); time = time.AddMinutes(1))
            {
                Items1.Add(new Item { Time = time, Value = time.Subtract(DateTime.Now).TotalSeconds });
                Items2.Add(new Item { Time = time, Value = 12 * 60 * 60 - time.Subtract(DateTime.Now).TotalSeconds});
                //Items2.RemoveAt(0);
                TimesMinutes.Add(time);
            }
            for (var time = DateTime.Now; time < DateTime.Now.AddHours(12); time = time.AddSeconds(1))
            {
                TimesSeconds.Add(time);
            }            
        }
        public ObservableCollection<DateTime> TimesMinutes
        {
            get { return (ObservableCollection<DateTime>)GetValue(TimesMinutesProperty); }
            set { SetValue(TimesMinutesProperty, value); }
        }
        // Using a DependencyProperty as the backing store for Times.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty TimesMinutesProperty =
            DependencyProperty.Register("TimesMinutes", typeof(ObservableCollection<DateTime>), typeof(MainWindow), new PropertyMetadata(new ObservableCollection<DateTime>()));
        public ObservableCollection<DateTime> TimesSeconds
        {
            get { return (ObservableCollection<DateTime>)GetValue(TimesSecondsProperty); }
            set { SetValue(TimesSecondsProperty, value); }
        }
        // Using a DependencyProperty as the backing store for Times.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty TimesSecondsProperty =
            DependencyProperty.Register("TimesSeconds", typeof(ObservableCollection<DateTime>), typeof(MainWindow), new PropertyMetadata(new ObservableCollection<DateTime>()));        
        public ObservableCollection<Item> Items1
        {
            get { return (ObservableCollection<Item>)GetValue(Items1Property); }
            set { SetValue(Items1Property, value); }
        }
        // Using a DependencyProperty as the backing store for MyProperty.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty Items1Property =
            DependencyProperty.Register("Items1", typeof(ObservableCollection<Item>), typeof(MainWindow), new PropertyMetadata(new ObservableCollection<Item>()));
        public ObservableCollection<Item> Items2
        {
            get { return (ObservableCollection<Item>)GetValue(Items2Property); }
            set { SetValue(Items2Property, value); }
        }
        // Using a DependencyProperty as the backing store for MyProperty.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty Items2Property =
            DependencyProperty.Register("Items2", typeof(ObservableCollection<Item>), typeof(MainWindow), new PropertyMetadata(new ObservableCollection<Item>()));
        
    }
}