Zoom does not work if you scroll a webpage

Sujit · Post by **Sujit** » Wed Nov 05, 2008 10:10 am

Hi,

I have a wen page on which there are two teechart controls : one at top and one at bottom. The zoom on first webchart works fine if you do not scroll down the page. If you scroll the page to see second wechart, the zoom does not work properly.

There was another guy on this forum who had simillar problem but, i could not find solution to this problem.

Here is a code for your reference. Appreciate some help on this.

HERE IS MY ASPX file
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>

<%@ Register Assembly="TeeChart" Namespace="Steema.TeeChart.Web" TagPrefix="tchart" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<asp:PlaceHolder ID="myContent" Runat="Server">
<asp:TextBox ID="TextBox1" runat="server" AutoPostBack="True"></asp:TextBox>
 
<asp:TextBox ID="TextBox2" runat="server" AutoPostBack="True"></asp:TextBox>
 
<asp:TextBox ID="TextBox3" runat="server" AutoPostBack="True"></asp:TextBox>

<asp:HiddenField ID="hdnTest" EnableViewState="true" Visible="true" runat="server" />
<tchart:WebChart EnableViewState="true" ID="WebChart1" runat="server" AutoPostback="False"
Height="300px" TempChart="Session" Width="400px" GetChartFile="GetChart.aspx" />
 
 
 
 
 
 
 
 
 
 
 
 
 
<asp:Button ID="Button1" runat="server" Text="Button" />
<tchart:WebChart EnableViewState="true" ID="WebChart2" runat="server" AutoPostback="False"
Height="300px" TempChart="Session" Width="400px" GetChartFile="GetChart.aspx" />
<asp:Button ID="Button2" runat="server" Text="Button" />
</asp:PlaceHolder>
</form>
</body>
</html>

HERE is the code behind:

Imports System.IO
Partial Class _Default
Inherits System.Web.UI.Page

Private Const SCRIPT_DOFOCUS As String = "document.getElementById('REQUEST_LASTFOCUS').focus();"
Dim clickedX As Integer
Dim clickedY As Integer
Dim msgText As String
Dim ButtonClicked As Boolean = False
Dim WithEvents seriesHotspot1 As Steema.TeeChart.Tools.SeriesHotspot = New Steema.TeeChart.Tools.SeriesHotspot()
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
If Not IsPostBack Then
Dim ch1 As Steema.TeeChart.Chart = WebChart1.Chart
ch1.Tools.Add(New Steema.TeeChart.Tools.SeriesHotspot())
ch1.Tools.Add(New Steema.TeeChart.Tools.ZoomTool())
CType(ch1.Tools(1), Steema.TeeChart.Tools.ZoomTool).ZoomPenColor = System.Drawing.Color.OliveDrab
CType(ch1.Tools(0), Steema.TeeChart.Tools.SeriesHotspot).Style = Steema.TeeChart.Styles.MarksStyles.LabelValue

Dim tmpChart As MemoryStream = New MemoryStream()
ch1.Export.Template.Save(tmpChart)
Session.Add("ch1", tmpChart)

ch1 = WebChart2.Chart
ch1.Tools.Add(New Steema.TeeChart.Tools.SeriesHotspot())
ch1.Tools.Add(New Steema.TeeChart.Tools.ZoomTool())
CType(ch1.Tools(1), Steema.TeeChart.Tools.ZoomTool).ZoomPenColor = System.Drawing.Color.OliveDrab
CType(ch1.Tools(0), Steema.TeeChart.Tools.SeriesHotspot).Style = Steema.TeeChart.Styles.MarksStyles.LabelValue

tmpChart = New MemoryStream()
ch1.Export.Template.Save(tmpChart)
Session.Add("ch2", tmpChart)
Else
Dim tmpChart As MemoryStream = CType(Session("ch1"), MemoryStream)
tmpChart.Position = 0
Dim ch1 As Steema.TeeChart.Chart = WebChart1.Chart.Import.Template.Load(tmpChart)
CheckZoom(WebChart1)

tmpChart = CType(Session("ch2"), MemoryStream)
tmpChart.Position = 0
ch1 = WebChart2.Chart.Import.Template.Load(tmpChart)
CheckZoom(WebChart2)
End If
End Sub

Private Sub CheckZoom(ByRef wChart As Steema.TeeChart.Web.WebChart)
'wChart.Chart.Tools.Add(seriesHotspot1)
'wChart.Chart.Tools.Add(New Steema.TeeChart.Tools.ZoomTool())
Dim zoomedState As ArrayList = CType(Session(wChart.ID + "Zoomed"), ArrayList)
zoomedState = CType(wChart.Chart.Tools(1), Steema.TeeChart.Tools.ZoomTool).SetCurrentZoom(Request, zoomedState)
If (IsDBNull(zoomedState)) Then
Session.Remove(wChart.ID + "Zoomed")
Else
Session.Add(wChart.ID + "Zoomed", zoomedState)
End If
End Sub

Private Sub HookOnFocus(ByVal CurrentControl As Control)
'CType(CurrentControl, WebControl).Attributes.Add("onfocus", "try{document.getElementById('__LASTFOCUS').value=this.id} catch(e) {}")

If ((CurrentControl.GetType().Name = "TextBox") Or (CurrentControl.GetType().Name = "DropDownList") Or (CurrentControl.GetType().Name = "ListBox") Or (CurrentControl.GetType().Name = "Button")) Then
Dim str As String = CType(CurrentControl, WebControl).ID
Dim hdn As HiddenField = CType(Page.FindControl("hdnTest"), HiddenField)
CType(CurrentControl, WebControl).Attributes.Add("onfocus", "document.getElementById('" + hdn.ClientID + "').value= '" + str + "';")
End If

If (CurrentControl.HasControls()) Then
Dim CurrentChildControl As Control
For Each CurrentChildControl In CurrentControl.Controls
HookOnFocus(CurrentChildControl)
Next
End If
End Sub

Protected Sub hotspot1_GetHTMLMap(ByVal sender As Steema.TeeChart.Tools.SeriesHotspot, ByVal e As Steema.TeeChart.Tools.SeriesHotspotEventArgs) Handles seriesHotspot1.GetHTMLMap
'e.PointPolygon.Attributes = e.Series.XValues.Value(e.PointPolygon.ValueIndex).ToString() + "," + e.Series.YValues.Value(e.PointPolygon.ValueIndex).ToString()
End Sub

Protected Sub WebChart1_ClickSeries(ByVal sender As Object, ByVal s As Steema.TeeChart.Styles.Series, ByVal valueIndex As Integer, ByVal e As System.EventArgs) Handles WebChart1.ClickSeries
Dim tChart As Steema.TeeChart.Chart = (CType(sender, Steema.TeeChart.Web.WebChart)).Chart

clickedX = s.CalcXPos(valueIndex)
clickedY = s.CalcYPos(valueIndex)
msgText = "Clicked Series: " + tChart.Series.IndexOf(s).ToString() + " Value: " + s.YValues(valueIndex).ToString()
End Sub

Protected Sub WebChart1_AfterDraw(ByVal sender As Object, ByVal g As Steema.TeeChart.Drawing.Graphics3D) Handles WebChart1.AfterDraw
If (clickedX <> -1) Then
g.Font.Color = System.Drawing.Color.OrangeRed
g.TextOut(clickedX, clickedY, msgText)
End If
End Sub

Protected Sub TextBox3_TextChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles TextBox3.TextChanged

End Sub

Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button1.Click
Dim tmpChart As MemoryStream = CType(Session("ch1"), MemoryStream)
tmpChart.Position = 0
Dim ch1 As Steema.TeeChart.Chart = WebChart1.Chart.Import.Template.Load(tmpChart)

ch1.Series.RemoveAllSeries()
'ch1.Series.Add(New Steema.TeeChart.Styles.LinePoint())
'ch1.Series(0).Add(
'ch1.Series.Add(New Steema.TeeChart.Styles.Line())
ch1.Legend.Shadow.Visible = False
ch1.Legend.Visible = False
'ch1.Series(0).Title = "Data"
'ch1.Series(0).FillSampleValues(4)
'ch1.Series(0).Color = Drawing.Color.Blue

'ch1.Series(1).Title = "Daughter Rolls"
'ch1.Series(1).FillSampleValues(4)
'ch1.Series(0).Color = Drawing.Color.Red
ch1.Aspect.View3D = False

'Header
ch1.Header.Text = "Chart as Image"
ch1.Header.Pen.Visible = False
ch1.Header.Font.Name = "Verdana"
ch1.Header.Font.Color = System.Drawing.Color.DarkBlue
ch1.Header.Font.Size = 10
ch1.Header.Shadow.Visible = True
ch1.Header.Shadow.Color = System.Drawing.Color.DarkGray

' Axis
ch1.Axes.Left.Labels.Font.Color = System.Drawing.Color.DarkGray
ch1.Axes.Bottom.Labels.Font.Color = System.Drawing.Color.DarkGray
ch1.Axes.Left.Title.Text = "Data"
ch1.Axes.Bottom.Title.Text = "Daughter Rolls"
ch1.Legend.Visible = True
ch1.Legend.CustomPosition = True

'dim ar as New '
Dim Line1 As New Steema.TeeChart.Styles.LinePoint(ch1)
Dim Line2 As New Steema.TeeChart.Styles.Line(ch1)
Line1.Add(10, "0320008120")
Line1.Add(20, "0320009729")
Line1.Add(30, "0320007292")
Line1.Add(40, "0310008369")
Line1.Add(40, "0310006723")
Line1.Add(40, "0320005241")
Line1.Add(40, "0330037372")
Line1.Add(40, "0310052526")
Line1.Title = "Data points"
Line1.Color = Drawing.Color.Blue

Line2.Add(10, "0320008120")
Line2.Add(20, "0320009729")
Line2.Add(30, "0320007292")
Line2.Add(40, "0310008369")
Line2.Add(40, "0310006723")
Line2.Add(40, "0320005241")
Line2.Add(40, "0330037372")
Line2.Add(40, "0310052526")
'ch1.Series(0).Marks.Visible = True
Line2.Color = Drawing.Color.Yellow
Line2.Title = "Data p"

'If Not IsPostBack() Then
' HookOnFocus(CType(Me.Page, Control))
'Else
' Dim hdn As HiddenField = CType(Page.FindControl("hdnTest"), HiddenField)
' Dim str As String = SCRIPT_DOFOCUS.Replace("REQUEST_LASTFOCUS", hdn.Value)
' ClientScript.RegisterStartupScript(Page.GetType(), "ScriptDoFocus", str, True)
'End If
tmpChart = New MemoryStream()
ch1.Export.Template.Save(tmpChart)
Session.Add("ch1", tmpChart)

End Sub

Protected Sub Button2_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button2.Click
Dim tmpChart As MemoryStream = CType(Session("ch2"), MemoryStream)
tmpChart.Position = 0
Dim ch1 As Steema.TeeChart.Chart = WebChart2.Chart.Import.Template.Load(tmpChart)

ch1.Series.RemoveAllSeries()
ch1.Legend.Shadow.Visible = False
ch1.Legend.Visible = False
ch1.Aspect.View3D = False

'Header
ch1.Header.Text = "Chart as Image"
ch1.Header.Pen.Visible = False
ch1.Header.Font.Name = "Verdana"
ch1.Header.Font.Color = System.Drawing.Color.DarkBlue
ch1.Header.Font.Size = 10
ch1.Header.Shadow.Visible = True
ch1.Header.Shadow.Color = System.Drawing.Color.DarkGray

' Axis
ch1.Axes.Left.Labels.Font.Color = System.Drawing.Color.DarkGray
ch1.Axes.Bottom.Labels.Font.Color = System.Drawing.Color.DarkGray
ch1.Axes.Left.Title.Text = "Data"
ch1.Axes.Bottom.Title.Text = "Daughter Rolls"
ch1.Legend.Visible = True
ch1.Legend.CustomPosition = False

'dim ar as New '
Dim Line1 As New Steema.TeeChart.Styles.LinePoint(ch1)
Dim Line2 As New Steema.TeeChart.Styles.Line(ch1)
Line1.Add(10, "10")
Line1.Add(20, "20")
Line1.Add(30, "30")
Line1.Add(40, "40")
Line1.Add(50, "50")
Line1.Add(60, "60")
Line1.Add(70, "70")
Line1.Add(80, "80")
Line1.Title = "Data points"

Line2.Add(10, "10")
Line2.Add(20, "20")
Line2.Add(30, "30")
Line2.Add(40, "40")
Line2.Add(50, "50")
Line2.Add(60, "60")
Line2.Add(70, "70")
Line2.Add(80, "80")
'ch1.Series(0).Marks.Visible = True
Line1.Title = "Data p"

tmpChart = New MemoryStream()
ch1.Export.Template.Save(tmpChart)
Session.Add("ch2", tmpChart)
End Sub
End Class

Narcís · Post by **Narcís** » Wed Nov 05, 2008 10:42 am

Hi Sujit,

Simultaneous Zoom and Scroll are not supported on WebChart. The feature request is listed however for inclusion in a future update. I don't have a date for that at present.

Sujit · Post by **Sujit** » Wed Nov 05, 2008 11:27 am

Hi,

Thanks for your response.

I am not trying zoom and scroll functionality of a tee chart. I am scrolling a webpage down to zoom my second tee chart and it is not working.

If i do not scroll the page and zoom the first tee chart it works fine.

I need to resolve it ASAP as the project i am working on contains 6 charts in a single page and the user has to sroll down to see the bottom charts.

Narcís · Post by **Narcís** » Wed Nov 05, 2008 11:59 am

Hi Sujit,

Code you posted works fine for me here. No matter if I scroll the page or not both charts zoom correctly. I'm using latest TeeChart for .NET v3 (Build 3.5.3225.32183/4/5), which was release last Monday. Which TeeChart version are you using?

Sujit · Post by **Sujit** » Wed Nov 05, 2008 3:23 pm

Hi Narcís,

I am using a demo version V3 for .net 2005.
Once i can see i can statisfy all my needs i will be purchasing a license for the same.

Narcís · Post by **Narcís** » Wed Nov 05, 2008 3:53 pm

Hi Sujit,

New build of the evaluation version has been posted at the client area today. Could you please try uninstalling your current version, install latest evaluation version available and check if this solves the problem for you?

Thanks in advance.

Sujit · Post by **Sujit** » Thu Nov 06, 2008 10:13 am

Hi Narcís,

It works fine when i have installed a licensed version for V3. But, when i have copied it to web server it still gives me the same problem.

Is it a problem with licensing? I have a runtime we server license with me but i do not know how to install it.

Appreciate your help.

Thanks in advance!

Sujit

Narcís · Post by **Narcís** » Thu Nov 06, 2008 10:21 am

Hi Sujit,

You need to deploy TeeChart.dll to the server together with your application. I strongly recommend you to read Tutorial 17 - Designtime, Runtime and License Requirements. You'll find tutorials at TeeChart's program group.