'Index was out of range. Must be non-negative and less than the size of the collection.'

Question

Was trying to plot a chart on UWP mobile app using Visual Studio. On the .cs file, the following are the codes;

The class declaration is:

public class Average
{   
    public string Date { get; set; }
    public int DailyAverageForChart { get; set; }
}

public viewChart()
{
    this.InitializeComponent();
    List<Average> listOfAverage = new List<Average>();

    listOfAverage.Add(new Average { Date = "1", DailyAverageForChart = 20 });
    listOfAverage.Add(new Average { Date = "2", DailyAverageForChart = 30 });
    listOfAverage.Add(new Average { Date = "3", DailyAverageForChart = 10 });

    (ColumnChart.Series[0] as ColumnSeries).ItemsSource = listOfAverage;
}

On the .xaml file, has the following codes;

<Grid>
    <Charting:Chart x:Name="ColumnChart" 
                    HorizontalAlignment="Center" 
                    VerticalAlignment="Center" 
                    Height="450" 
                    Width="314" 
                    Margin="0,0,0,0"/>
    <Charting:ColumnSeries Title="Average Consumption" 
                           Margin="0" 
                           IndependentValuePath="Date" 
                           DependentValuePath="DailyAverageForChart" 
                           IsSelectionEnabled="True"/>
</Grid>

No compilation error, however when come to this .xaml file during runtime, the following error pointing at the statement (ColumnChart.Series[0] as ColumnSeries).ItemsSource = listOfAverage;

Error message is :

System.ArgumentOutOfRangeException: 'Index was out of range. Must be non-negative and less than the size of the collection.'

Please advise. Thank you very much.

Can you try: ColumnChart.ColumnSeries[0] instead of ColumnChart.Series[0] — Eray Balkanli, Aug 12 '19 at 17:29
Thanks Juharr and Eray Balkanli. This is first time using this columnChart.series and don't know how to fill it up. ColumnChart.ColumnSeries[0] also not available in Charting. — Meng, Aug 12 '19 at 18:06
at the .xaml code line 7, remove the slash "/". Add before . The chart appears. Thank you very much. — Meng, Aug 12 '19 at 19:05

score 0 · Answer 1 · answered Aug 12 '19 at 17:38

0

Your problem here is ColumnChart.Series does not contain any elements, so ColumnChart.Series[0] is "undefined". I believe you will need to use ColumnChart.ColumnSeries[0] based on the XML provided. To increase the reliability, I would prefer using if-else blocks like:

if (ColumnChart != null)
{
   if (ColumnChart.ColumnSeries.Count > 0)
   {
      (ColumnChart.ColumnSeries[0] as ColumnSeries).ItemsSource = listOfAverage;
   }
   else
   {
      LogWarning("ColumnChart.ColumnSeries[0] does not contain any elements");
   }
}
else
{
   LogWarning("ColumnChart object is null");
}

where LogWarning would be a custom built-in function which is logging the error/warning to a specific location that I can use for troubleshooting.

answered Aug 12 '19 at 17:38

Eray Balkanli

6,960
9
39
65

Thanks Eray for your reply and suggestion. Since ColumnChart.Series is empty (or probably is empty), how to fill it up in the first place. The above codes are actually referencing to youtube https://www.youtube.com/watch?v=cnkrkB-I-q4 which demo chart plotting. I probably have missed out something. – Meng Aug 12 '19 at 18:11
hi Eray, found the problem in .xaml codes and would like to share with you. – Meng Aug 12 '19 at 18:33
at the .xaml code line 7, remove the slash "/". Add before . The chart appears. Thank you very much. – Meng Aug 12 '19 at 19:05
Glad to help Meng – Eray Balkanli Aug 12 '19 at 19:23

'Index was out of range. Must be non-negative and less than the size of the collection.'

1 Answers1