Update Radchart on timer postback not working

[James]

I am writing an application that creates potentially multiple dynamic charts on a page from parameters saved in a database.  When the page initially loads the charts are created after getting information from the database.  There is a timer on the page that executes a postback and I have code in the "IsPostback" block on page load that calls the function used to create the chart with the same parameters being passed as well as a call to the database to get the new values to update the chart.

I can see that the new values are present when the code is run from the timer postback to create the chart and I can see through fiddler that the image never gets created because "chartimage.axd" never gets called again after the initial non-postback load on the server to be sent back to the browser.  What am I missing to make this work properly?

Thanks for any help that can be provided.

James

Code block run the initial time that chart is successfully created as well as each time after that when the timer fires.

ChartSubpanelsTimer.Enabled = true;

if (ConfigurationManager.AppSettings["ChartUpdateFrequency"] != "")

    ChartSubpanelsTimer.Interval = Convert.ToInt32(ConfigurationManager.AppSettings["ChartUpdateFrequency"])*1000;

 

WpfChartSubpanelProperties chartProps = (WpfChartSubpanelProperties)subPanelProps;

ViewState.Add("__Chart__" + subpanelCount, chartProps);

 

if (chartProps.StreamId.ToString() != Guid.Empty.ToString())

{

    initScript += GetNewDataStreamIdScript(chartProps.StreamId.ToString(), chartProps.DataMappingFilter);

}

 

initScript += string.Format("subpanels[{0}].dataStreams[0] = new dataStreamInfo(); ", subpanelCount);

initScript += string.Format("subpanels[{0}].dataStreams[0].id = '{1}'; ", subpanelCount, chartProps.StreamId.ToString());

initScript += string.Format("subpanels[{0}].dataStreams[0].keyField = '{1}'; ", subpanelCount, chartProps.KeyField);

initScript += string.Format("subpanels[{0}].dataStreams[0].dataMappingFilter = \"{1}\"; ", subpanelCount, chartProps.DataMappingFilter);

 

string strChartName = "";

int iChartWidth = chartProps.Width;

int iChartHeight = chartProps.Height;

int iChartTopPadding = 0;

int iChartLeftPadding = 0;

int iChartTop = chartProps.Top;

int iChartLeft = chartProps.Left;

keyField = chartProps.KeyField;

 

//Set up all common chart properties

RadChart newChart = new RadChart();

//Give chart ID

newChart.ID = chartProps.Name;

//set the background color

newChart.BackColor = chartProps.BackColor;

//set the chart size

newChart.Width = iChartWidth;

newChart.Height = iChartHeight;

//set the border size and color

newChart.Appearance.Border.Width = chartProps.BorderWidth;

newChart.Appearance.Border.Color = chartProps.BorderColor;

 

//Set the Chart Title and Appearance

newChart.ChartTitle.Appearance.Position.AlignedPosition = AlignedPositions.Top;

newChart.ChartTitle.Appearance.Dimensions.AutoSize = false;

newChart.ChartTitle.Appearance.Dimensions.Width = iChartWidth - (chartProps.BorderWidth * 2);

newChart.ChartTitle.Appearance.Dimensions.Height = 30;

newChart.ChartTitle.Appearance.FillStyle.FillType = FillType.Solid;

newChart.ChartTitle.Appearance.FillStyle.MainColor = Color.SaddleBrown;

 

//Set the Chart Title Textblock Properties

newChart.ChartTitle.TextBlock.Text = chartProps.Title;

newChart.ChartTitle.TextBlock.Appearance.TextProperties.Font = new Font(chartProps.TitleFont.Name, chartProps.TitleFont.Size, chartProps.TitleFont.Style);

newChart.ChartTitle.TextBlock.Appearance.TextProperties.Color = Color.White;

newChart.ChartTitle.TextBlock.Appearance.Position.AlignedPosition = AlignedPositions.Top;

 

//Charts don't allow autonscaling so cut it off

newChart.PlotArea.YAxis.AutoScale = false;

newChart.PlotArea.XAxis.AutoScale = false;

 

//Setup the legend

newChart.Legend.Appearance.Location = LabelLocation.OutsidePlotArea;

switch (chartProps.LegendPosition)

{

    case ChartLegendLocation.Right:

        newChart.Legend.Appearance.Position.AlignedPosition = AlignedPositions.Right;       

        break;

    case ChartLegendLocation.Left:

        newChart.Legend.Appearance.Position.AlignedPosition = AlignedPositions.Left;

        break;

    case ChartLegendLocation.Top:

        newChart.Legend.Appearance.Position.AlignedPosition = AlignedPositions.Top;

        break;

    case ChartLegendLocation.Bottom:

        newChart.Legend.Appearance.Position.AlignedPosition = AlignedPositions.Bottom;

        break;

    case ChartLegendLocation.None:

        newChart.Legend.Visible = false;

        break;

}

 

//retrieve data

DataTable data = GetDataStream(chartProps.StreamId, chartProps.DataMappingFilter) ?? new DataTable();

var view = new DataView(data);

 

newChart.Series.ClearItems();

 

if (chartProps.PlotType == ChartPlotType.Graph)

{

    //Set the chart scale MIN and MAX values

    newChart.PlotArea.YAxis.MinValue = chartProps.MinChartValue;

    newChart.PlotArea.YAxis.MaxValue = chartProps.MaxChartValue;

 

    //Loop through and add each series in chart

    foreach (TDS.QuickCOM.ImageProfile.ChartSeriesProperties chartField in chartProps.ChartFields)

    {

        ChartSeries chartSeries = new ChartSeries();

        chartSeries.Appearance.LabelAppearance.Visible = true;

        chartSeries.Name = chartField.Text;

 

        switch (chartField.SeriesType)

        {

            case GridSeriesType.Area:

                chartSeries.Type = ChartSeriesType.Area;

                break;

            case GridSeriesType.Bar:

                //if horizontal bar then

                chartSeries.Type = ChartSeriesType.Bar;

                newChart.SeriesOrientation = ChartSeriesOrientation.Vertical;

                //set the X Axis

                newChart.PlotArea.XAxis.Clear();

                foreach (DataRow dr in data.Rows)

                {

                    newChart.PlotArea.XAxis.AddItem((string)dr[keyField]);

                    chartSeries.AddItem((double)(long)dr[chartField.Field]);

                }

                //configure the tick settings for chart

                ConfigureChartTickSettings(chartProps.TickRatio, newChart);

                //set the Y axis

                 

                 

                break;

            case GridSeriesType.HorizontalBar:

                chartSeries.Type = ChartSeriesType.Bar;

                newChart.SeriesOrientation = ChartSeriesOrientation.Horizontal;

                break;

            case GridSeriesType.Line:

                chartSeries.Type = ChartSeriesType.Line;

                chartSeries.Appearance.LineSeriesAppearance.Color = Color.FromName(chartField.SeriesColor.ToString());

                break;

            case GridSeriesType.Spline:

                chartSeries.Type = ChartSeriesType.Spline;

                chartSeries.Appearance.LineSeriesAppearance.Color = Color.FromName(chartField.SeriesColor.ToString());

                break;

            case GridSeriesType.SplineArea:

                chartSeries.Type = ChartSeriesType.SplineArea;

                break;

        }

 

         

        //add series to chart

        newChart.Series.Add(chartSeries);

    }

 

}

else if (chartProps.PlotType == ChartPlotType.Doughnut)

{

 

 

}

else if (chartProps.PlotType == ChartPlotType.Pie)

{

 

 

}

else if (chartProps.PlotType == ChartPlotType.TimeSeries)

{

 

 

}

 

System.Web.UI.WebControls.Panel ChartPanel = new System.Web.UI.WebControls.Panel();

ChartPanel.Controls.Add(newChart);

RadAjaxManager1.AjaxSettings.AddAjaxSetting(ChartSubpanelsTimer, newChart);

 

//Add RadialGauge object to the div wrapper

ChartPanel.ID = string.Format("StylePanel_{0}", chartProps.Name);

ChartPanel.Height = iChartHeight;

ChartPanel.Width = iChartWidth;

//set style and background image for panel

ChartPanel.Attributes.Add("style", string.Format("background-repeat:no-repeat; position: fixed; top: {0}px; left: {1}px; width: {2}px; height: {3}px; padding-left: {4}px; padding-top: {5}px;", iChartTop, iChartLeft, iChartWidth, iChartHeight, iChartLeftPadding, iChartTopPadding));

 

RadAjaxPanel gaugeAjaxPanel = new RadAjaxPanel();

gaugeAjaxPanel.ID = string.Format("UpdatePanel_{0}", chartProps.Name);

gaugeAjaxPanel.Controls.Add(ChartPanel);

form1.Controls.Add(gaugeAjaxPanel);

 

break;

My HttpHandler sections.

  <httpHandlers>
    <add verb="*" path="Dart.PowerWEB.LiveControls.GetResource.aspx" type="Dart.PowerWEB.LiveControls.ResourceHttpHandler,Dart.PowerWEB.LiveControls" />
    <add path="Telerik.Web.UI.WebResource.axd" type="Telerik.Web.UI.WebResource" verb="*" validate="false" />
    <add path="ChartImage.axd" type="Telerik.Web.UI.ChartHttpHandler" verb="*" validate="false" />
    <add path="Telerik.Web.UI.SpellCheckHandler.axd" type="Telerik.Web.UI.SpellCheckHandler" verb="*" validate="false" />
    <add path="Telerik.Web.UI.DialogHandler.aspx" type="Telerik.Web.UI.DialogHandler" verb="*" validate="false" />
    <add path="Telerik.RadUploadProgressHandler.ashx" type="Telerik.Web.UI.RadUploadProgressHandler" verb="*" validate="false" />
  </httpHandlers>

<system.webServer>
  <validation validateIntegratedModeConfiguration="false" />
  <modules runAllManagedModulesForAllRequests="true" />
  <handlers>
    <remove name="ChartImage_axd" />
    <remove name="Telerik_Web_UI_SpellCheckHandler_axd" />
    <remove name="Telerik_Web_UI_DialogHandler_aspx" />
    <remove name="Telerik_RadUploadProgressHandler_ashx" />
    <remove name="Telerik_Web_UI_WebResource_axd" /><add name="Telerik_Web_UI_WebResource_axd" path="Telerik.Web.UI.WebResource.axd" type="Telerik.Web.UI.WebResource" verb="*" preCondition="integratedMode" />
    <add name="ChartImage_axd" path="ChartImage.axd" type="Telerik.Web.UI.ChartHttpHandler" verb="*" preCondition="integratedMode" />
    <add name="Telerik_Web_UI_SpellCheckHandler_axd" path="Telerik.Web.UI.SpellCheckHandler.axd" type="Telerik.Web.UI.SpellCheckHandler" verb="*" preCondition="integratedMode" />
    <add name="Telerik_Web_UI_DialogHandler_aspx" path="Telerik.Web.UI.DialogHandler.aspx" type="Telerik.Web.UI.DialogHandler" verb="*" preCondition="integratedMode" />
    <add name="Telerik_RadUploadProgressHandler_ashx" path="Telerik.RadUploadProgressHandler.ashx" type="Telerik.Web.UI.RadUploadProgressHandler" verb="*" preCondition="integratedMode" />
  </handlers>

</system.webServer>

[James]

Okay, I now have the chartimage.axd being called on ever timer tick now, but the image never changes even though the data point values are changed when the chart is recreated.  Does anyone have any idea why this is occurring?  The image does get saved in session and its almost like the same image from session is being displayed every time.  I am quite sure that new values are being set for the chart data points.

Please help if anyone has any idea what I am doing wrong here.

Thanks,

James

[Ves]

Hi James,

I examined your code and I found that you configure the control and add it to the page afterwards. Adding it this way, the entire control configuration is lost due to the viewstate being loaded. You must first add the control to the page and then configure it.

Best regards,
Ves
the Telerik team