Silverlight Toolkit chart control doesnt always show X axis values

Question

I have an Silverlight 5 application which is using the Silverlight Toolkit. Now, the Silverlight Toolkit chart control doesnt always show X axis values when there is only one result in the resultset that returns from my webserivce.

The first image shows that my chart is loaded properly when selecting a big enough resultset. The second image shows that it doesn't when the resultset exists of 1 item.

This is my implementation:

TimeSpan monthSpan = TimeSpan.FromDays(30.0);
TimeSpan daySpan = TimeSpan.FromDays(1.0);
TimeSpan hourSpan = TimeSpan.FromHours(1.0);

foreach (TagValueResult res in e.NewItems)
{
    if (res != null)
    {
        LineSeries lineSeries = new LineSeries()
        {
            Title = string.Format("{0}" + Environment.NewLine + " {2} ({1})", res.Name, res.Attributes["UOM"], res.Attributes["Description"]),
            ItemsSource = res.Values,
            DependentValueBinding = new System.Windows.Data.Binding("Value"),
            IndependentValueBinding = new System.Windows.Data.Binding("Key"),
            Tag = res,
            PolylineStyle = Resources["thinLineStyle"] as Style,
            //DataPointStyle = Resources["dataPointStyle"] as Style
        };
        if (res.Values.Any() && chart.Series.Any() == false)
        {
            TimeSpan graphSpan = res.Values.ToList().Last().Key - res.Values.ToList().First().Key;

            lineSeries.IndependentAxis = new DateTimeAxis
            {
                Minimum = res.Values.ToList().First().Key,
                Maximum = res.Values.ToList().Last().Key,
                Interval = 1,
                Orientation = AxisOrientation.X,
                Location = AxisLocation.Bottom
            };

            if (graphSpan > monthSpan)
            {
                ((DateTimeAxis)lineSeries.IndependentAxis).IntervalType = DateTimeIntervalType.Days;
                ((DateTimeAxis)lineSeries.IndependentAxis).Interval = 5;
            }
            else if (graphSpan > daySpan && graphSpan < monthSpan)
            {
                ((DateTimeAxis)lineSeries.IndependentAxis).IntervalType = DateTimeIntervalType.Days;
                ((DateTimeAxis)lineSeries.IndependentAxis).Interval = 1;
            }
            else if (graphSpan > hourSpan && graphSpan < daySpan)
            {
                ((DateTimeAxis)lineSeries.IndependentAxis).IntervalType = DateTimeIntervalType.Hours;
                ((DateTimeAxis)lineSeries.IndependentAxis).Interval = 1;
            }
            else if (graphSpan < hourSpan)
            {
                ((DateTimeAxis)lineSeries.IndependentAxis).IntervalType = DateTimeIntervalType.Minutes;
                ((DateTimeAxis)lineSeries.IndependentAxis).Interval = 15;
            }
            else
            {
                //sometimes all comparisons fail, just back up to a safe interval of 1 day.
                ((DateTimeAxis)lineSeries.IndependentAxis).IntervalType = DateTimeIntervalType.Days;
                ((DateTimeAxis)lineSeries.IndependentAxis).Interval = 1;
            }
        }
        chart.Series.Add(lineSeries);
    }
}

Do you have any idea's? I'm out of possible solutions.

Answer 1

A collection with one item will have incorrect behavior in several places of your code.

Here graphSpan will equal zero:

TimeSpan graphSpan = res.Values.ToList().Last().Key - res.Values.ToList().First().Key;

And here Maximum and Minimum will be the same:

lineSeries.IndependentAxis = new DateTimeAxis
{
    Minimum = res.Values.ToList().First().Key,
    Maximum = res.Values.ToList().Last().Key,

I suggest that you add another if-block and construct a different axis for the special case when the collection has only 1 item.

var values = res.Values.ToList();
TimeSpan graphSpan = values.Last().Key - values.First().Key;

if (graphSpan == TimeSpan.Zero)
{
    lineSeries.IndependentAxis = new DateTimeAxis
    {
        Orientation = AxisOrientation.X,
        Location = AxisLocation.Bottom
    };
}
else
{
    lineSeries.IndependentAxis = new DateTimeAxis
    {
        Minimum = values.First().Key,
        Maximum = values.Last().Key,
        Orientation = AxisOrientation.X,
        Location = AxisLocation.Bottom
    };

    if (graphSpan > monthSpan)
    {
        ((DateTimeAxis)lineSeries.IndependentAxis).IntervalType = DateTimeIntervalType.Days;
        ((DateTimeAxis)lineSeries.IndependentAxis).Interval = 5;
    }
    else if (graphSpan > daySpan && graphSpan < monthSpan)
    {
        ((DateTimeAxis)lineSeries.IndependentAxis).IntervalType = DateTimeIntervalType.Days;
        ((DateTimeAxis)lineSeries.IndependentAxis).Interval = 1;
    }
    else if (graphSpan > hourSpan && graphSpan < daySpan)
    {
        ((DateTimeAxis)lineSeries.IndependentAxis).IntervalType = DateTimeIntervalType.Hours;
        ((DateTimeAxis)lineSeries.IndependentAxis).Interval = 1;
    }
    else if (graphSpan < hourSpan)
    {
        ((DateTimeAxis)lineSeries.IndependentAxis).IntervalType = DateTimeIntervalType.Minutes;
        ((DateTimeAxis)lineSeries.IndependentAxis).Interval = 15;
    }
    else
    {
        //sometimes all comparisons fail, just back up to a safe interval of 1 day.
        ((DateTimeAxis)lineSeries.IndependentAxis).IntervalType = DateTimeIntervalType.Days;
        ((DateTimeAxis)lineSeries.IndependentAxis).Interval = 1;
    }
}