TeeChart for .NET图表控件教程：ASP.NET 络应用

TeeChart通过WebChart TeeChart控件为WebForms集成。WebChart可以在标准TeeChart的工具箱中找到。

TeeChart for .NET是优秀的 4.0 WinForm 图表控件，官方独家授权汉化，集功能全面、性能稳定版、优惠等优势。NET 的 TeeChart for .NET 中文承诺让您在使用和学习上没有语言障碍，最少可以节省 30% 的开发时间。

点击立即下载最新版TeeChart for .NET

WebForms

TeeChart通过WebChart TeeChart控件为WebForms集成。WebChart可以在标准TeeChart的工具箱中找到。 络安装。

向窗体添加图表

• 从工具箱中选择WebChart组件并将其拖放到WebForm上，然后拖动到合适的大小

WebChart以图像的形式呈现在WebForm上，默认的格式是PNG，但是可以通过Properties Windows中的PictureFormat属性改变。为了与 页的兼容性，我们建议使用PNG、JPEG或GIF格式，尽管Internet Explorer浏览器也支持位图。

使用GIF图像格式

GIF使用256色减少，因此，为了全面彩色复制，我们建议您使用其他图像格式之一。

TempChart属性可以用来选择临时图表在创建后和显示在浏览器页面之前应该如何存储。有4个可用的设置:

• File 
• Session 
• Cache 
• Httphandler 

所有缓存技术的性能都是相似的，尽管磁盘性能可能会对“File”选项产生积极或消极的影响，因此“File”可能是最快的选项。

文件

如果您希望将临时文件写入磁盘，应该使用File设置。默认情况下，在安装TeeChart时，它会创建带有临时文件位置和等效虚拟文件夹名称的注册表项。关键字如下:

HKEY_LOCAL_MACHINESOFTWARESteema SoftwareTeeChart.NET]"VirtualShare"="/TeeChartForNET""ShareFolder"="C:\Program Files\Steema Software\TeeChart for .NET v3\TeeChartForNET"

如果接受默认安装位置，上述设置将在标准英语机器中创建。teecharnet虚拟文件夹是由TeeChart安装程序创建的。如果您创建了必要的IIS虚拟共享位置以反映新的注册表值，您可以更改这些注册表设置。

WebChart将文件保存到ShareFolder注册表项下的文件夹_Chart_tmp下。

临时文件不会被TeeChart删除，尽管一个实用程序可能包括为您这样做自动作为Windows计划任务，请检查TeeChart包含与当前版本。

Session

Session是临时文件存储的设置，它不会在磁盘上留下任何文件，并且会删除自己缓存的内存文件(请参见Cache和Httphandler选项)。在某些情况下，您可能会发现它比临时磁盘文件稍慢。要成功地使用Session变量运行Chart，必须满足两个条件:

会话必须为应用程序启用。“启用”是默认行为，可以在项目web中检查。配置文件:

< sessionState

mode= ” InProc “

InProc是默认设置，表示为这个应用程序启用了Session。

• 应该包含一个aspx脚本模块来从内存中检索图表。aspx脚本的名字应该叫做“GetChart”。TeeChart附带的WebForm ASP中包含了一个例子。要从头创建一个新的GetChart模块，请在你的项目中添加一个新的WebForm(也可以是任何aspx文件)，命名为“GetChart”，并在Page_Load事件中添加以下代码:

GetChart.aspx.cs

        private void Page_Load(object sender, System.EventArgs e)        {            string chartName=Request.QueryString["Chart"];            if (Session[chartName]!=null)            {                System.IO.MemoryStream chartStream = new System.IO.MemoryStream();                chartStream=((System.IO.MemoryStream)Session[chartName]);                Response.ContentType = "image/" + "png";                Response.OutputStream.Write(chartStream.ToArray(),0,(int)chartStream.Length);                chartStream.Close();                Session.Remove(chartName);            }        } 

该脚本恢复WebChart之前保存到会话缓存中的图表。该脚本将Chart返回给浏览器，并将其从缓存中删除。

缓存

缓存选项在设置中与会话图缓存选项非常相似。’Cache’是一个实用的选项，因为它使用了属于ASP的Cache对象。NET WebForm页面，这样很容易为大多数ASP。NET应用程序配置，而“会话”容易受到某些Web服务器的管理限制(例如:管理员出于安全原因选择禁用会话支持)。

缓存选项需要使用GetChart。aspx文件。

• 你应该包含一个aspx脚本模块来从内存中检索图表。aspx脚本的名字应该叫做“GetChart”。TeeChart附带的WebForm ASP中包含了一个例子。要从头创建一个新的GetChart模块，请在你的项目中添加一个新的WebForm(也可以是任何aspx文件)，命名为“GetChart”，并在Page_Load事件中添加以下代码:

GetChart.aspx.cs

        private void Page_Load(object sender, System.EventArgs e)        {            string chartName=Request.QueryString["Chart"];            if (Page.Cache[chartName]!=null)            {                MemoryStream chartStream = new MemoryStream();                chartStream=((MemoryStream)Page.Cache[chartName]);                Response.ContentType = "image/" + "png";                Response.OutputStream.Write(chartStream.ToArray(),0,(int)chartStream.Length);                chartStream.Close();            }        }

该脚本恢复WebChart之前保存到页面缓存中的图表。该脚本将Chart返回给浏览器，并将其从缓存中删除。

Httphandler

Httphandler选项使用一个内部的TeeChart (WebChart)生成器来恢复页面的Chart图像。该选项不生成临时文件，也不需要额外的aspx文件来恢复图表(就像使用Session和Cache选项一样)。这个选项需要对 页进行一次修改。配置文件:

在 络之间的任何地方。配置 <system.web> </system.web> 标签放置以下部分:

<system.web>  <httpHandlers>       <add verb="*" path="TeeChartImgGen.ashx" type="Steema.TeeChart.Web.TeeChartImgGen, TeeChart"/>  </httpHandlers>/*..content cut for brevity ..*/</system.web>

使用交互式图表事件(当图表中没有WebChart工具时，AutoPostback属性为True)

加载事件和运行时交互事件，响应用户在图表上的鼠标点击可以与TeeChart的WebChart一起使用。使用像“AfterDraw”这样的油漆事件不需要采取特殊的操作，你可以从属性浏览器的事件列表中选择图表事件。如果图表中没有TeeChart WebChart工具，如缩放、滚动或热点，则应将AutoPostback属性设置为True，以启用交互式(用户单击)事件。如果出现上述工具，则自动激活单击响应。对于交互式事件，图表将响应用户的鼠标点击事件，将点击发生在哪里的信息发送回服务器，这样您的服务器端代码就可以对事件进行操作。然后可以从属性浏览器事件列表中选择要使用的事件进行编码。

Event的例子

如果您希望在您的WebChart中使用点击事件，如ClickSeries，请确保将图表自动回传设置为true。

事件可以通过在属性浏览器事件列表中双击所需的事件来设置:

双击列表中的条目将创建代码内事件声明。

例子

        private int xVal;        private int yVal;        private void WebChart1_AfterDraw(object sender, Steema.TeeChart.Drawing.Graphics3D g)        {            g.TextOut(xVal,yVal,"onAfterDraw");        }

上面的事件将在由xVal和yVal变量值决定的位置向Chart输出文本。
x和y值可以根据点击位置设置

        private void WebChart1_ClickSeries(object sender, Steema.TeeChart.Series s, int valueIndex, System.EventArgs e)        {            xVal=s.CalcXPos(valueIndex);            yVal=s.CalcYPos(valueIndex);        }

免费脚本ASP应用程序

在WebForm中使用WebChart的另一种方法是在标准的asp (aspx)页面中使用TeeChart作为一个脚本化的“不可见”控件。. net的TeeChart附带了一个演示此技术的实例。你可以找到它包含在TeeChart的ASP。NET演示项目，示例名为“与图表交互图表作为图像”演示文件夹下的“系列类型作为图像”

TeeChart可以通过内部的Chart类在ASP中自由编写脚本，但是为了利用TeeChart事件，我们建议使用TChart Windows窗体组件或WebChart控件

将图表添加到脚本中
假设使用了TChart，你需要采取的初始步骤来设置TeeChart项目:
1. 创建新的ASP。 络形式的项目。这将创建一个WebForm页面，您将使用它作为客户端页面。(见例子SeriesTypes。aspx页面)
2. 添加新的WebForm页面。此页面将是不可见的，将用于处理图表代码服务器端。(见例子ShowSeries。aspx页面)
-页面应该包括一个引用系统。windows . forms .dll。这是因为TChart组件是一个Windows。形式的基础组件。

3.按照这里突出显示的代码步骤和ASPStreams示例中的步骤来设置你的项目。

Process 流程

客户端浏览器页面(SeriesTypes.aspx)包含一个图像，其IMG链接是aspx服务器脚本(ShowSeries.aspx)。客户端页面上的提交按钮使用参数化serverChart处理所需的变量调用服务器脚本。按钮将变量作为参数的一部分发送，以设置客户端页面图表图像的imageURL，因此返回一个基于处理参数的动态图表。

编码与TeeChart

代码与TeeChart服务器端添加一个使用TeeChart脚本页面:
eg
Using Steema.TeeChart;
然后为TChart声明一个变量，并在Page_Load事件开始时创建它

eg

        private void Page_Load(object sender, System.EventArgs e)        {            tChart=new TChart();            /* ...add Series and data, etc ... */        } 

检索图表的关键代码元素

图表检索的关键代码组件有:

1. 客户“获取”指令。这可以通过一个提交按钮或其他方式，如组合框和“获取”图表从服务器基于客户端参数。对图表的请求可以发送为“传统的获取url行，其中参数作为一个url行传递，或者可以通过ASP。NET的“在页面之间传递服务器控件值”(请参阅微软关于这个主题的帮助主题以获得更多细节)。调用服务器脚本的编码将在 页后面的WebForms Code中进行。

例子
在这个例子中，变量取自不同的WrbForm页面元素，并作为参数添加到Image ‘Get’ url行。

        private void sendInfo()        {            seriesType=DropDownList1.Items[DropDownList1.SelectedIndex].ToString();            viewType=CheckBox1.Checked.ToString();            Image1.ImageUrl="http://"+webServer  /*use webserver variable for server*/                +"/TeeChartForNET/ASPStream/ProcessChart.aspxeriestype="                +seriesType+"&view="+viewType;        }

2. 服务器脚本从客户机接收GET请求并运行其Page_Load事件。在这种情况下，图表可能被创建，接收到的参数可能被用来定义图表是如何被填充的。然后将Chart呈现为图像，并作为流返回给客户端。

例子

        private void Page_Load(object sender, System.EventArgs e)        {            tChart=new TChart();            tChart.AfterDraw += new Steema.TeeChart.TChart.PaintChartEventHandler(this.tChart_AfterDraw);            /* ...add Series and data, etc ... */            //Process Get parameters received from client            if (Request.QueryString["view"]=="False")                tChart.Aspect.View3D=false;            else                tChart.Aspect.View3D=true;            MemoryStream tempStream = new MemoryStream();            tChart.Export.Image.PNG.Save(tempStream);            Response.ContentType="Image/PNG";            Response.OutputStream.Write(tempStream.ToArray(),0,(int)tempStream.Length);            tempStream.Close();        }

添加事件

通过在图表创建之后添加事件，可以为自由脚本的TeeChart ASP应用程序添加图表创建事件。

例子

        private void Page_Load(object sender, System.EventArgs e)        {            tChart=new TChart();            tChart.AfterDraw += new Steema.TeeChart.TChart.PaintChartEventHandler(this.tChart_AfterDraw);            /* ...add Series and data, etc ... */            MemoryStream tempStream = new MemoryStream();            tChart.Export.Image.PNG.Save(tempStream);            Response.ContentType="Image/PNG";            Response.OutputStream.Write(tempStream.ToArray(),0,(int)tempStream.Length);            tempStream.Close();        }        private void tChart_AfterDraw(object sender, Steema.TeeChart.Drawing.Graphics3D g)        {            string tmpStr="Copyright My Organisation "+DateTime.Now.ToString();            g.TextOut(g.Chart.Width-(int)g.TextWidth(tmpStr)-5,g.Chart.Height-(int)g.TextHeight("H")-3,tmpStr);        } 

AfterDraw事件代码将在图表创建时执行，在这种情况下，相关的消息将包括在图表画布上，因为图表被渲染成图像。如果你想在客户端页面上使用基于用户鼠标点击的交互事件，我们建议你在WebForm上使用WebChart组件。

安全问题

. net通过安装程序安装的默认TeeChart创建文件夹和IIS虚拟文件夹，这些文件夹足以访问ASP。TeeChart中包含的NET示例。WebForm应用程序假定IIS中激活了会话支持来移动临时图表信息。示例项目可以在Visual Studio中修改。NET使用“文件”作为媒介来临时存储图表。在Windows 2000的测试中，工作得令人满意。在Windows 2003中，默认安装的附加安全限制限制了使用默认的’_chart_temp’文件夹的可能性(temp文件夹的名称和位置是可配置的)。在Win2003服务器中，系统管理员必须修改安全权限，以允许ASP将临时文件保存到磁盘。NET应用程序的问题。

WebChart工具

HotspotTool

这个工具最简单的形式是激活一个数据点鼠标经过标签，当鼠标经过一个点时显示出来。Hotspot工具也可用于Winform图表，但操作的性质不同，如这里描述的WebChart。WebChart热点工具生成与每个数据点相关联的地图区域。地图动作可以从以下选项中选择。
-标记-显示一个点标记根据选择的样式选项。
– URL -单击数据点时连接到一个URL

-脚本-运行自定义Javascript当一个数据点被单击

Mark
使用Style属性来定义标记样式。
Eg. (via code) 
Steema.TeeChart.Tools.SeriesHotspot hotspotTool =  
         ((Steema.TeeChart.Tools.SeriesHotspot)WebChart1.Chart.Tools[0]);

hotspotTool.MapAction = Steema.TeeChart.Styles.MapAction.Mark; 

hotspotTool.Style = Steema.TeeChart.Styles.MarksStyles.LabelPercentTotal; 

//init code....Steema.TeeChart.Tools.SeriesHotspot hotspotTool =          ((Steema.TeeChart.Tools.SeriesHotspot)WebChart1.Chart.Tools[0]);hotspotTool.GetHTMLMap += new Steema.TeeChart.Tools.SeriesHotspotEventHandler(hotspotTool_GetHTMLMap);//event code:private void hotspotTool_GetHTMLMap(Steema.TeeChart.Tools.SeriesHotspot sender, Steema.TeeChart.Tools.SeriesHotspotEventArgs e){     if (CheckBox1.Checked)  //open new window       e.PointPolygon.Attributes="target='_blank'";     else        e.PointPolygon.Attributes="target='_self'";        tab     if (e.Series==WebChart1.Chart.Series[0]) e.PointPolygon.HREF="http://" + TextBox1.Text; //set URL according to textbox text + TextBox1.Text; //set URL according to textbox text     if (e.Series==WebChart1.Chart.Series[1]) e.PointPolygon.HREF="http://" + TextBox2.Text;     if (e.Series==WebChart1.Chart.Series[2]) e.PointPolygon.HREF="http://" + TextBox3.Text; + TextBox3.Text;     if (e.Series==WebChart1.Chart.Series[3]) e.PointPolygon.HREF="http://" + TextBox4.Text;}

脚本
Script选项可用于处理任何自定义内容或增值，您可能希望通过Javascript添加到图表。当脚本被选择作为一个选项时，TeeChart添加了一个选项来使用一个助手脚本，当前可用的:’Annotation'(参见Steema.TeeChart.Tools.HotspotHelperScripts)。您可以选择不使用helper脚本并定义自己的输出。
注释的例子:

protected void Page_Load(object sender, System.EventArgs e){  //initialization  Chart ch1 = WebChart1.Chart;  Steema.TeeChart.Themes.ColorPalettes.ApplyPalette(ch1, 9);  Steema.TeeChart.Tools.SeriesHotspot hotspot1 = new Steema.TeeChart.Tools.SeriesHotspot();  ch1.Legend.Visible = false;  ch1.Tools.Add(hotspot1);  hotspot1.MapAction = Steema.TeeChart.Styles.MapAction.Script;  hotspot1.GetHTMLMap += new Steema.TeeChart.Tools.SeriesHotspotEventHandler(hotspot1_GetHTMLMap);  //....etc... more init code}private void hotspot1_GetHTMLMap(Steema.TeeChart.Tools.SeriesHotspot sender, Steema.TeeChart.Tools.SeriesHotspotEventArgs e){     //This example calls a Bar Series but e.Series and e.PointPolygon.ValueIndex could be sent     //as arguments for a drilldown query.     //The prepared HelperScriptAnnotation text accepts your text as a variable for the Annotation     //In the following case it calls an aspx script to generate and return a Chart as an image     e.PointPolygon.Attributes=String.Format(Texts.HelperScriptAnnotation,                            "<IMG SRC=ShowSeries.aspxeriestype=Bar&view=False&width=100&height=80>");     //The annotation could, alternatively, present text in the mouseover hint, eg.:     //e.PointPolygon.Attributes=String.Format(Steema.TeeChart.Texts.HelperScriptAnnotation,"hello world.");} 

在上面的例子中使用的HelperScriptAnnotation是:

HelperScriptAnnotation = ” onmouseover = ” ShowAnnotation(“{0}”);“onmouseout = ”ShowAnnotation(“);“”;

如果要添加自己的输出，可以在这里将调用替换为自己的代码。

string myProcess = ="onmouseover="ShowAssociatedDataTable('{0}');e.PointPolygon.Attributes = String.Format (myProcess e.PointPolygon.ValueIndex.ToString ());

因此，您将使用ShowAssociatedDataTable方法来操作您的调用，以显示相关的数据表。

ScrollTool

滚动工具在WebChart的底部添加了一个滚动条。您可以设置图表的可见部分大小和起始位置。图表也是可拖动的，尽管该功能可能被取消。滚动工具可以与热点工具结合使用。

Steema.TeeChart.Tools.ScrollTool scrollTool =                         ((Steema.TeeChart.Tools.ScrollTool)WebChart1.Chart.Tools[0]);scrollTool.StartPosition = 30;scrollTool.SegmentViewUnits = Steema.TeeChart.Tools.ScrollToolViewUnit.percent;scrollTool.ViewSegmentSize = 20;

如果需要使用window onload事件，请参阅window onload事件部分。

ZoomTool
ZoomTool允许选择图表的子区域进行缩放处理。该区域可以通过鼠标拖动在图表区域上选择，缩放坐标返回给服务器以创建一个缩放区域。在相反的方向上拖动，该区域不会被放大。

要使用ZoomTool，你应该在你的页面代码中添加以下方法。

private void CheckZoom(WebChart wChart){     ArrayList zoomedState=(ArrayList)Session[wChart.ID+""Zoomed""];     zoomedState=((Steema.TeeChart.Tools.ZoomTool)wChart.Chart.Tools[0]).SetCurrentZoom(Request

                                                        

声明：本站部分文章及图片源自用户投稿，如本站任何资料有侵权请您尽早请联系jinwei@zod.com.cn进行处理,非常感谢！