RadHtmlChart : 0x800a138f - JavaScript runtime error: Unable to get property 'length' of undefined or null reference

While loading the boxplot chart I'm getting above error. I will appreciate if you can help me figure out, why.

I have spent a lot of time on this with no luck.

Thanks.
Gauri

Here is the chart design 
<telerikUI:RadHtmlChart runat="server" ID="chartDrilldownPLOS" Width="770" Height="230">
                    <Appearance>
                        <FillStyle BackgroundColor="White"></FillStyle>
                    </Appearance>
                    <ChartTitle>
                        <Appearance Visible="false"></Appearance>
                    </ChartTitle>
                    <PlotArea>
                        <Series>
                            <telerikUI:BoxPlotSeries
                                DataLowerField="Q1Min"
                                DataQ1Field="Q2Min"
                                DataMedianField="GroupMean"
                                DataQ3Field="Q3Max"
                                DataUpperField="Q4Max">
                                
                                <Appearance FillStyle-BackgroundColor="#165b8c"></Appearance>

                                <TooltipsAppearance Color="#165b8c" BackgroundColor="#67adda">
                                    <ClientTemplate>
                                        Minumum: #=dataItem.Q1Min# <br />
                                        25th Percentile: #=dataItem.Q2Min# <br />
                                        Median: #=dataItem.GroupMean# <br />
                                        75th Percentile: #=dataItem.Q3Max# <br />
                                        Maximum: #=dataItem.Q4Max# <br />
                                    </ClientTemplate>
                                </TooltipsAppearance>
                            </telerikUI:BoxPlotSeries>
                        </Series>
                        <XAxis>
                            <MinorGridLines Visible="false" />
                            <MajorGridLines Visible="false" />
                            <Items></Items>
                        </XAxis>
                        <YAxis>
                            <MinorGridLines Visible="false" />
                        </YAxis>
                        
                    </PlotArea>
                </telerikUI:RadHtmlChart>


Here is the code to load it

        private void LoadChartDrilldownPLOS(int drilldownLevel, string hospitals, string surgeons)
        {
            using (var chartingctx = new ChartingDataContext())
            {
                var resultFromDb = chartingctx.getPLOSDrillDown(sourceType, riskCategory, riskLevel,
                    cbbDateType.SelectedValue == "1" ? true : false, dtpStartDate.SelectedDate, dtpEndDate.SelectedDate,
                    hospitals, surgeons, chkIndexOperation.Checked, drilldownLevel);

                chartDrilldownPLOS.PlotArea.XAxis.Items.Clear();
                DataTable datatable = new DataTable();
                datatable.Columns.Add("Q1Min");
                datatable.Columns.Add("Q2Min");
                datatable.Columns.Add("Q3Max");
                datatable.Columns.Add("Q4Max");
                datatable.Columns.Add("GroupMean");
                foreach (var result in resultFromDb)
                {
                    chartDrilldownPLOS.PlotArea.XAxis.Items.Add(new AxisItem(result.DateGroup));
                    datatable.Rows.Add(new object[] { result.Q1Min ?? 0, result.Q2Min ?? 0, result.Q3Max ?? 0, result.Q4Max ?? 0, 
                        result.GroupMean ?? 0 });
                }
                                
                chartDrilldownPLOS.DataSource = datatable;
                chartDrilldownPLOS.DataBind();
            }
            drilldownTypePLOS = drilldownLevel;
        }