ASP.net Timer loading dynamic chart causes screen to jump

On my ASP.net site www.online-excel.com I am running the following code to dynamically
load a chart on the timer tick every few seconds. At the top of the page I have MaintainScrollPositionOnPostback="true"
but the screen jumps. How can I prevent the screen from jumping

    Protected Sub Timer1_Tick(sender As Object, e As EventArgs) Handles Timer1.Tick
        Try
            oAdd_Random_Chart()
        Catch ex As Exception
            Response.Write(ex.Message & " aka34")
        End Try

    End Sub


    Sub oAdd_Random_Chart()

        Try

            ' Initialize the Chart object    
            Dim chart1 As New Chart()
            chart1.ID = "chart1"

            'Add to do code here

            ' Initialize objects and elements
            Dim chartArea1 As New ChartArea()
            Dim legend1 As New Legend()
            Dim series1 As New Series()
            Dim series2 As New Series()
            Dim series3 As New Series()
            Dim series4 As New Series()
            Dim series5 As New Series()

            ' Set the Chart Properties
            chart1.Width = 900
            chart1.Height = 340

            chart1.BackColor = System.Drawing.Color.Navy
            chart1.BorderSkin.SkinStyle = BorderSkinStyle.Emboss

            chart1.BorderlineColor = System.Drawing.Color.Gray
            'chart1.BorderLineStyle = ChartDashStyle.Solid
            chart1.BorderlineWidth = 4
            chart1.BackGradientStyle = GradientStyle.LeftRight

            ' Set the ChartArea properties
            chartArea1.Name = "Default"
            chartArea1.BackColor = System.Drawing.Color.SlateGray
            chartArea1.BackGradientStyle = GradientStyle.LeftRight

            'Enable AJAX features such as zooming and scrolling for the ChartArea
            'chartArea1.CursorX.UserEnabled = True
            'chartArea1.CursorY.UserEnabled = True

            ' Add the ChartArea to the Chart
            chart1.ChartAreas.Add(chartArea1)

            ' Set the Legend properties
            legend1.Name = "Default"
            legend1.Docking = Docking.Bottom
            legend1.LegendStyle = LegendStyle.Row
            legend1.Alignment = System.Drawing.StringAlignment.Center

            legend1.BackColor = System.Drawing.Color.Transparent
            legend1.BorderColor = System.Drawing.Color.Black
            legend1.BorderWidth = 1

            ' Add the Legend to the Chart
            chart1.Legends.Add(legend1)

            ' Set the Series properties
            series1.Name = "Store 1"
            series1.ChartType = SeriesChartType.Line
            series1.BorderColor = Drawing.Color.Black
            series1.BorderWidth = 3
            'following two lines used to change series line colors....
            series1.EmptyPointStyle.Color = Drawing.Color.Transparent
            series1.Color = Drawing.Color.DodgerBlue

            series2.Name = "Store 2"
            series2.BorderColor = System.Drawing.Color.DarkSlateGray
            series2.BorderWidth = 3
            series2.ChartType = SeriesChartType.Line
            'following two lines used to change series line colors....
            series2.EmptyPointStyle.Color = Drawing.Color.Transparent
            series2.Color = Drawing.Color.Green

            series3.Name = "Store 3"
            series3.BorderWidth = 3
            series3.ChartType = SeriesChartType.Line
            'following two lines used to change series line colors....
            series3.EmptyPointStyle.Color = Drawing.Color.Transparent
            series3.Color = Drawing.Color.Red


            series4.Name = "Store 4"
            series4.BorderWidth = 3
            series4.ChartType = SeriesChartType.Line
            'following two lines used to change series line colors....
            series4.EmptyPointStyle.Color = Drawing.Color.Transparent
            series4.Color = Drawing.Color.Olive


            series5.Name = "Store 5"
            series5.BorderWidth = 3
            series5.ChartType = SeriesChartType.Line
            'following two lines used to change series line colors....
            series5.EmptyPointStyle.Color = Drawing.Color.Transparent
            series5.Color = Drawing.Color.MintCream

            ' Add the Series to the Chart
            chart1.Series.Add(series1)
            chart1.Series.Add(series2)
            chart1.Series.Add(series3)
            chart1.Series.Add(series4)
            chart1.Series.Add(series5)

            ' Add points to each series.
            Dim rnd As New Random()
            Dim S As String = "Laptops,Desktops,Cameras,Smart Phones,Phones,Batteries,Computer Bags,Camera Bags,Accessories,Airtime,Modems,Memory Sticks,3g USB Modems"
            Dim arrSplit As Object = Split(S, ",")
            Dim oNewRandomNumber As String

            For Each ser As Series In chart1.Series
                For i As Integer = 0 To 12
                    'ser.Points.AddY(rnd.[Next](5, 10))
                    oNewRandomNumber = rnd.[Next](0, 100)
                    If ser.Name = "Store 1" Then
                        oNewRandomNumber = oNewRandomNumber * 0.5
                    ElseIf ser.Name = "Store 2" Then
                        oNewRandomNumber = oNewRandomNumber * 0.7
                    ElseIf ser.Name = "Store 3" Then
                        oNewRandomNumber = oNewRandomNumber * 0.9
                    ElseIf ser.Name = "Store 4" Then
                        oNewRandomNumber = oNewRandomNumber * 0.3
                    ElseIf ser.Name = "Store 5" Then
                        oNewRandomNumber = oNewRandomNumber * 0.6
                    End If
                    ser.Points.AddXY(arrSplit(i), oNewRandomNumber)
                Next
            Next

            Dim oTitle As String = "Sales Activity Across Stores"
            chart1.Titles.Add(New Title(oTitle, Docking.Top, New Font("Century Gothic", 13, FontStyle.Regular), Drawing.Color.White))
            'Preserve the chart's state during callbacks
            'chart1.CallbackStateContent = CallbackStateContent.All

            Dim up2 As New UpdatePanel
            up2.ContentTemplateContainer.Controls.Add(chart1)
            'Panel1.Controls.Add(up2)
            'Me.Panel1.Controls.Add(chart1)
            Table2.Rows(0).Cells(0).Controls.Add(up2)
        Catch ex As Exception
            Response.Write(ex.Message & " tre34")
        End Try
    End Sub

Open in new window

Murray BrownMicrosoft Cloud Azure/Excel Solution DeveloperAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Robert SchuttSoftware EngineerCommented:
The fact that you need to use MaintainScrollPositionOnPostback is a hint that the whole page is being updated/refreshed instead of just updating the UpdatePanel. A quick look around the 'net suggests you may not be using the right trigger type; use AsyncPostBackTrigger, here is some aspx code that works for me, creating everything dynamically might also be possible but I haven't tried it:
    <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>
    <div>
        test test test <br />
        ... <br />
        test test test <br />
        <hr />
        <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Conditional" ChildrenAsTriggers="true">
            <ContentTemplate>
                <asp:Timer ID="Timer1" runat="server" Interval="2000">
                </asp:Timer>
                <asp:Table ID="Table2" runat="server">
                <asp:TableRow>
                <asp:TableCell></asp:TableCell>
                </asp:TableRow>
                </asp:Table>
            </ContentTemplate>
            <Triggers>
                <asp:AsyncPostBackTrigger ControlID="Timer1" />
            </Triggers>
        </asp:UpdatePanel>
    </div>
    </form>

Open in new window

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Murray BrownMicrosoft Cloud Azure/Excel Solution DeveloperAuthor Commented:
Hi Robert. Great answer! Thanks very much
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
ASP.NET

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.