teechart属设置.doc

设计背景基于服务器/浏览器架构的解决方案在越来越多的领域得到应用。使用ASP脚本，我们可以方便地访问各种数据库，生成与用户交互的动态页面。一般情况下，由浏览器解释要显示的结果，其中统计数据的显示结果一般采用HTML表格形式。笔者在铁路车站Intranet系统的开发过程中，遇到要把数据库中的统计结果用统计图表（柱状图、折线图、饼图等）方式输出的问题。因为统计图表在美观和易于理解等方面有着表格所不具备的优越性，所以这个问题具有一定的普遍性。目前，针对这个问题，主要有3种可行的解决方案：1在浏览器端安装使用图表控件如MsChart等。这样做的缺点是在客户端要安装和注册ActiveX控件，操作较为复杂，并且把客户端系统限制在Windows的范围内。2使用Java Applet显示图形。这样做开发难度较高，需要针对具体的应用要求编制Java绘图程序。3在服务器端使用控件动态生成图形文件（JPEG格式），此方法可以适用于任何流行的客户端浏览器。本文讨论第3种方案，使用的控件是TeeChart Pro ActiveX 4.0版（目前最新版本为8.0（最新版本下载），另外TeeChart还有TeeChart for .NET 、TeeChart Pro VCL / CLX 、TeeChart Pro for Java 以及 TeeChart for PHP ）。TeeChart控件应用TeeChart Pro ActiveX 是西班牙Steema SL公司开发的图表类控件，主要用来生成各种复杂的图表。熟悉Delphi和C Builder的编程人员对它不会陌生，因为在Delphi和C Builder里包括了TeeChart的VCL版本。本文将详细介绍TeeChart控件应用方法，本文使用的是TeeChart Pro ActiveX 4.0，它的试用版可以点击这里下载。TeeChart Pro ActiveX 4.0的主要特性如下：图表的坐标轴 Bar, Bar3D以及Horizontal Bar序列 TChartListBox 图表主题 TColorBand工具 TCommander 自定义图表调色板 图表中的图例 新的“2DLighting”工具 新的SurfaceNearest工具 新增加的函数 图表编辑器 饼状图和圆环图序列 三维点序列 图表画布 图表序列组 输出格式 All Series with Pointer property所有序列都拥有Pointer属性 图表的SeriesList属性 TChart1.SeriesList.ClearValues TeeChart Pro ActiveX 4.0的这些特性使得它具有极大的灵活性，并且使用起来非常方便，只要写很少的代码，就可以做出各种复杂、漂亮的图表。TeeChart图表控件类的属性和方法TeeChart图表控件的主类是TChart。TChart中使用了56个类、325个属性、125个方法以及28个事件，这使得TChart具有非常强大的功能。本文仅简单地介绍其中一些重要类的属性和方法。TChart.Height：图表的高度（像素）；TChart.Width：图表的宽度（像素）；TChart.Header：图表的题头(Ititles类)；TChart.Series：序列(Series类的数组)；TChart.Axes：坐标轴(Iaxes类)；TChart.Legend：图例(Legend类)；TChart.Panel：面板（Ipanel类）；TChart.Canvas：画布（Canvas类）。Series是要显示的数据的主体。在一个图表中可以有一个或多个序列，每个序列可以有不同的显示类型，如Line、Bar、Pie等等。Axes控制图表坐标轴的属性，在缺省的情况下，坐标轴可以自动地根据不同的数据设置好标度范围和间隔，当然也可以手工调整。Legend控制图表的图例显示。Legend是图表中的一个长方形的用来显示图例标注的区域。可以标注Series的名称或者Series中的项目和数值。Panel可以设置图表的背景。可以使用渐变的颜色或者图像文件作为整个图表的背景。Canvas可以让设计者绘制自己的图形。使用方法和Delphi中的Canvas一样。有TextOut、LineTo、Arc等各种画图的方法可以调用。TChart的一些属性实际上是其他类的变量，这些类又具有自己的属性和方法。如Ititles类又具有Text、Color、Font等属性，我们可以用这些属性来设置题头的文本、颜色和字体。TeeChart图表控件和其他的图表控件相比，有一个非常重要的特点是TeeChart图表控件可以把图表保存为一个JPEG格式的图形文件。调用格式如下：TChart.Export.SaveToJPEGFile (FileName,Gray,Performance,Quality,Width,Height)其中FileName是JPEG文件的保存路径和文件名，路径应该是操作系统中的绝对路径，而不是IIS中的相对路径，IIS对相应的保存目录应该具有写权限。Gray指明是否保存为黑白图像。Performance指明JPEG是生成质量优先还是速度优先。Quality是一个0到100的整数，100时JPEG质量最好，但文件最大；Quality越小则生成的文件越小，但图像质量也随之下降。为了解决在多用户并发访问Web的情况下，JPEG文件互相覆盖的问题，我们使用了如下所示的一种JPEG文件的命名机制：OutputJPEGFile =“Chart” Session.Sessionid Replace(Time,“.”,“”) “.jpg”在文件名中包括了Sessionid和当前时间，并使用后台进程定期删除过期文件。TeeChart控件应用实例下面是一个简单的ASP程序，从中可以看到TeeChart图表控件在ASP中的使用方法。程序的运行环境为：Windows 2000 Professional、IIS5.0和TeeChart Pro ActiveX .0测试版。TeeChart JPEG Chart Demo PageSet TChart1 = CreateObject(“TeeChart.TChart”)TChart1.Height=250TChart1.Width=500TChart1.Header.Text.ClearTChart1.Header.Text.Add “K180次旅客列车日发送人数统计图”TChart1.Panel.Gradient.Visible=TrueTChart1.Panel.Gradient.StartColor=RGB(200，255,200)TChart1.Panel.Gradient.EndColor=RGB(255,255,255)TChart1.AddSeries(scBar)TChart1.Series(0).ClearTChart1.Series(0).ColorEachPoint = TrueTChart1.Series(0).Add 180, “02/10”,clTeeColorTChart1.Series(0).Add 240, “02/11”,clTeeColorTChart1.Series(0).Add 210, “02/12”,clTeeColorTChart1.Series(0).Add 280, “02/13”,clTeeColorTChart1.Series(0).Add 218, “02/14”,clTeeColorTChart1.Series(0).Add 225, “02/15”,clTeeColorTChart1.Export.SaveToJPEGFile server.mappath(“/teechart”)“MyChart.jpg”,False,JPEGBestQuality, 85,TChart1.Width, TChart1.Height实现绘图步骤：1. 加入Teechart控件。2. 创建chart实例并设置相关全局属性(设置chart实例的属性将对所有其他成员，包括所有series实例产生影响)。3. 添加Series序列实例，设置该实例相关属性(设置实例化series的属性作用范围是该series实例，如果为单一series实例，可直接设置其属性而不设置chart实例)，并绑定数据源。常用属性：（假设控件实例为WebChart1，设置全局属性也可通过实例化chart来设置，即Steema.TeeChart.Chart Chart1 = WebChart1.Chart;在此不考虑这种）WebChart1.AutoPostback = false; /自动回发（默认）WebChart1.GetChartFile = GetChart.aspx; /处理数据页（默认），GetChart.aspx内容后附WebChart1.Width = 400; /显示宽度WebChart1.Height = 300; /显示高度WebChart1.PictureFormat = Steema.TeeChart.Export.PictureFormats.Bitmap; /显示图片的格式，默认PNG WebChart1.TempChart =Steema.TeeChart.Web.TempChartStyle.Session; /设置保存数据形式，默认File，一般选session。Chart.Aspect(外观属性) WebChart1.Chart.Aspect.View3D = false; /取消3D表示Chart.Header(显示头)WebChart1.Chart.Header.Visible = false; /是否显示头文字WebChart1.Chart.Header.Text = 顶部显示文字; Chart.Axes(坐标轴) WebChart1.Chart.Axes.Left.Title.Text = 纵坐标文字显示;WebChart1.Chart.Axes.Bottom.Title.Text = 横坐标文字显示;Chart.Legend(图例)WebChart1.Chart.Legend.LegendStyle = Steema.TeeChart.LegendStyles.Auto; /图例显示的样式，包含一下方面：默认auto WebChart1.Chart.Legend.Alignment=Steema.TeeChart.LegendAlignments.Bottom; /图例显示位置（显示线条颜色，线条代表对象） WebChart1.Chart.Legend.Visible = false; /是否显示图例WebChart1.Chart.Legend.Font.Color = System.Drawing.Color.Black; /图例文本显示颜色Chart.Panel(底板设置)WebChart1.Chart.Panel.Color = System.Drawing.Color.AliceBlue; /底板颜色（似乎不管用）实例化序列： Steema.TeeChart.Styles.Line line1 = new Steema.TeeChart.Styles.Line(); WebChart1.Chart.Series.Add(line); /实例化线，也可以如下一句完成：Steema.TeeChart.Styles.Line line1 = new Steema.TeeChart.Styles.Line(WebChart1.Chart); line1.YValues.DataMember = DS.Tables0.Columns2.ToString(); /设置比较刻度（纵坐标）line1.LabelMember = DS.Tables0.Columns1.ToString(); /设置成员标签（横坐标） line.Title = 111111; /设置其标题，可以在图例上显示此标题，多线时有用 line.Color = System.Drawing.Color.Red; /设置线条颜色，可不设置，默认 line1.DataSource = DS.Tables0;WebChart1.DataBind(); /数据绑定TChart使用经验小结喝小酒的网摘/a/10203.htm1、问题：通过Addxy方法给TChart添加标记（Mark）时，发现在TChart的横坐标会随着Mark而变化，后来发现通过以下方法 可避免这种情况：双击TChart，点击Axis- top or bottom -labels，在styles中将labels的形式改为Value即可！ 2、几个有用的属性： 图表上的每个点都是有索引的，就象一个数组一样，在OnClickSeries事件中有个ValueIndex属性，该属性可以得到鼠标所点击的点的索引值（必须将Series的Point设置为可见，鼠标点击到那个点时才可以触发该事件）。 xValueindex、yValueindex分别表示图表的索引为index的横纵坐标值，用这两个属性可以读取和设置索引为index的点 的值，注意：不要用xValues和yValues，这两个属性也可以达到同样的目的，但是速度非常的慢。因为后两个在进行操作的时候可能要遍历整个图表 上的值（个人观点） 在MouseDown,MouseMove,Mouseup中，可以利用xScreentoValue(x),yScreentoValue(y)得到鼠标当时所在点对应在图表上的横纵坐标值。 e.g. private Nowindex:Integer; Cantuo:boolean; . procedure TfrmMain.Chart1ClickSeries(Sender: TCustomChart; Series: TChartSeries; ValueIndex: Integer; Button: TMouseButton; Shift: TShiftState; X, Y: Integer);begin NowIndex:=ValueIndex;end; procedure TfrmMain.Chart1MouseDown(Sender: TObject; Button: TMouseButton; Shift: TShiftState; X, Y: Integer);beginCantuo:=true; end; procedure TfrmMain.Chart1MouseUp(Sender: TObject; Button: TMouseButton; Shift: TShiftState; X, Y: Integer);beginCantuo:=false;end; procedure TfrmMain.Chart1MouseMove(Sender: TObject; Shift: TShiftState; X, Y: Integer);beginif Cantuo thenbegin Series1.yValueNowIndex:= Series1.yScreenToValue(y) ;end;end; 这里即实现了可以在图表中拖动某一个点使其在纵轴上变化位置Tchart分析报告1 Tchart分析报告1.1 概述 TChart是delphi里面一个标准的图形显示控件。它可以静态设计（at design time）也可以动态生成。1.2 继承关系TObject TPersistent TComponent TControl TCustomControl TWedgetControl TChart TCustomPanel1.3 tips1.3.1 Pro Version支持Bezier , Contour , Radar和 point3D曲线1.3.2支持jpeg文件的导出1.3.3 Chart中的Series可以连接到Table , Query , RemoteDataset(其他数据集)1.3.4 TChart里的series的active属性可以实现对已绘制图形的显示或者隐藏1.3.5在TChart中, tchartSeries是所有具体series的父类,没有画出什么来的,用一个具体的series类来创建就可以了,比如用TLineSeries、TPieSeries、TPointSeries、TPointSeries等等都行1.3.6 TTeeFunction Component可以实现在同一个TChart里面，一个Serries对另一个Serries的统计1.4 问题极其使用技巧1.4.1 TChart中如何实现只有Y轴的放大与缩小功能？设置BottomAxis或者LeftAxis的Automatic:=false并同时设置Minimum,Maximum属性1.4.2如何固定TChart中的坐标，不使TChart中的坐标跟随Series的变化而变化？/设置底座标 with myChart.BottomAxis do begin Automatic:=false; Minimum:=0; LabelStyle := talText; end; /设置左坐标 with myChart.LeftAxis do begin Automatic:=false; Minimum:=0; Title.Angle:=270; Title.Font:=Self.Font; Title.Font.Charset:=ANSI_CHARSET; Title.Font.Name:=宋体; Grid.Visible := False; end; /设置右坐标 with myChart.RightAxis do begin Automatic:=false; Title.Font:=Self.Font; Title.Font.Charset:=ANSI_CHARSET; Title.Font.Name:=宋体; Title.Caption:=累计百分比（%）; Maximum:=100; Minimum:=0; end;1.4.3如何删除一个图形中的一个点？使用Series的delete 方法1.4.4如何修改一个点的X或者Y值？LineSeries1.YValue3 := 27.1 ; In Bubble Series BubbleSeries1.RadiusValues.Value 8 := 8.1 ; In Pie Series PieSeries1.PieValues.Value 3 := 111 ;1.4.5如果横坐标是时间（日期），如何进行设置？First, you need to set the DateTime property to True in the desired X and/or Y values list. LineSeries1.XValues.DateTime := True ; Second, use the same above described methods, but give the values as Date, Time or DateTime values LineSeries1.AddXY( EncodeDate( 1996 , 1 , 23 ) , 25.4 , Barcelona , clGreen );1.4.6如何在chart中画出的曲线某个点上标记出该点的值？Series.Marks.Visible:=true; Series.Marks.Style:=smsValue;1.4.7如何设置横轴或者纵轴的增长率？Chart.BottomAxis.Increment := DataTimeStep dtOneHour ; Chart.RightAxis.Increment := 1000;1.4.8如何对图象进行缩放？TChart的ZoomRect或者ZoomPercent方法 （Pie图可能不支持缩放）1.5 TChart可以绘制的图形1.5.1 Line ( TLineSeries)1.5.2FastLine (TFastLineSeries)相对Line来说，它损耗了某些属性从而来实现快速绘制1.5.3 Bar (TBarSeries)1.5.4 Horizontal bar (THorizBarSeries)1.5.5 Area (TAreaSeries)1.5.6 Point (TPointSeries)1.5.7 Pie (TPieSeries)1.5.8 Arrow (TArrowSeries)1.5.9 Bubble (TBubbleSeries)1.5.10 Gantt (TGanttSeries)1.5.11 Sharp (TChartShape)1.6 TChart的实时绘制 实时绘制对机器性能要求比较高，因此我们在编程的时候要注意下面几个方面： 使用2D图形 是Chart尽可能包含少的点 如果需要，可以移除（remove）chart的legend(?)和Title 使用默认的字体和字体大小 使用FastLineSeries 使用实体（solid）画笔和画刷格式 尽量避免使用圆形和环行bar样式 不要使用背景图片和渐变效果样式 把Chart的BevelInner和BevelOUter属性设置为bcNone 如果需要，把TChart的AxisVisible属性设置为False 把BufferedDisplay设置为false可以加速chart的重绘1.7 Scrolling TChart有4中scroll选择(AllowPanning属性)，分别是 不允许Scroll ( pmNone) ; 水平Scroll (pmHorizontal) ; 垂直Scroll (pmVertical) ; 水平和垂直Scroll (pmBoth) Procedure Scroll(Const Offset:Double; CheckLimits:Boolean); 例子如下： Chart1.BottomAxis.Scroll( 1000, True );这段代码也等同于 With Chart1.BottomAxis do Begin Automatic:=false; SetMinMax( Minimum+1000, Maximum+1000 ); End;1.8TChart中的全局变量1.9 TeeScrollMouseButton := mbRight;设置鼠标右键为TChart滚动键（默认） TeeScrollKeyShift := ssCtrl ; 要按住Control键才可以使Scroll滚动 1.9 TChartSerries使用技巧1.9.1运行时候创建一个Serries,三种方法：1Var MySeries : TBarSeries ; MySeries := TBarSeries.Create( Self ); MySeries.ParentChart := Chart1 ; 2Chart1.AddSeries( TBarSeries.Create( Self ) ); 3Var MyClass : TChartSeriesClass; MyClass := TBarSeries ; Chart1.AddSeries( MyClass.Create( Self ) );1.9.2获得TChart中的Serries数组，也有三种方法1MySeries := Chart1.SeriesList 0 2MySeries := Chart1.Series 0 3MySeries := Chart1 0 1.9.3 SerriesCount属性获得SeriesList中Series的个数1.9.4隐藏TChart中的Series有三种方法，但是效果不等价1 Series1.Active:=False; 仅仅隐藏，当设置为true的时候还可以显示出来 2 Series1.ParentChart:=nil ； 隐藏，重新设置ParentChart为TChart时候可以显示 3 Series1.Free; 删除了Series. 不可以恢复1.9.5 TChart中的数据排序 With Series1 do begin YValues.Order:=loAscending; YValues.Sort; Repaint; end; 定位一个点(Loacate a point) Series1.XValues.Locate(123); XValue和YValue都拥有的属性Total , TotalABS , MaxValue , MinValue teechart笔记(Delphi) 来自：bobo 日期：2006-12-4 23:09:07 全文阅读：loading. 分类：学习札记 1.series的方法 1.1 ColorRange设定一定范围的点和线的颜色。 procedure ColorRange(AValueList: TChartValueList; Const FromValue, ToValue: Double; AColor: TColor); 其中：The TChartValueList component is the container of point values. Each Series component has one or more values lists. The XValues and YValues properties are TChartValueList components. 可以是XValues 或YValues;FromValue, ToValue是范围。AColor是点的颜色。 UnitTeEngine DescriptionThis method will change the Color of a specified range of points. The FromValue and ToValue parameters are the beginning and end of the specified AValueList range. AValueList can be any Series ValueList such as: XValues, YValues, etc. 对某一特定的点:可以用series.valuecolorindex属性 property ValueColorIndex: Integer: TColor; Use the ValueColor property to get or set the Color of a point at a particular position. Index gives the position of the point, where 0 is the first, 1 is the second, and so on. 不过这两个方法都会导致线的颜色也会改变：改变的模式是若下一点出界，则从此点到下一点的连线的颜色变为指定点的颜色。 用这种方法可以改变各个点的形状，result即是具体点的形状。 function TForm1.Series1GetPointerStyle(Sender: TChartSeries; ValueIndex: Integer): TSeriesPointerStyle; begin if ValueIndex mod 2=0 then result:=psRectangle else result:=psTriangle; end; 1.2 CalcXPosValue 把某一轴X/Y轴的值，转化为窗体的像素值（整型）。 CalcXPosValue(Const Value: Double): Integer; UnitTeEngine DescriptionReturns the pixel Screen Horizontal coordinate of the specified Value. for example： procedure TForm1.Chart1AfterDraw(Sender: TObject); var tmp : Integer; begin tmp:=Series1.CalcPosValue( 123 ); with Chart1.Canvas do Rectangle(tmp-5,tmp-5,tmp 5,tmp 5); end; 1.3 画水平直线Chart1AfterDraw的时间中 Procedure TForm1.DBChart1AfterDraw(Sender: TObject); begin drawLimits(ChrtNum, width: integer; Value: Double; color: TColor); end; drawLimits(ChrtNum, width: integer; Value: Double; color: TColor); var PixValue:integer; begin with dbcht1.Canvas do begin PixValue := seriesx.CalcYPosValue(Value); if (PixValuedbcht1.ChartRect.Bottom) then/判断是否已经超出dbcht1.ChartRect的范围。 Pen.Color:=dbcht1.Color else Pen.Color := color; Pen.Width := width; MoveTo(dbcht1.ChartRect.Left, PixValue); LineTo(dbcht1.ChartRect.Right, PixValue); end; end; 1.4 通过函数function来画直线/各种自定义曲线； series|dataSource|function. 在object treeView对象观察器中 series1|TeeFunction1 的OnCalculate事件中添加公式 procedure TForm1.TeeFunction1Calculate(Sender: TCustomTeeFunction; const x: Double; var y: Double); begin y:=50; /y:=Sin(x/10); end; 1.5 取消chart的网格 在chart|axis|Ticks|grid中操作，此操作针对某一轴而言，如leftaxis，对于bottomaxis要选择它再操作。 1.6 mark tips显示数据标签的chart工具。 设定自定义的标签的方法： 设定一个单元局部变量 MarkText:string 在chart的onMouseMove中添加事件。 procedure TfrmVChart.dbcht1MouseMove(Sender: TObject; Shift: TShiftState; X, Y: Integer); var tmp: Integer; begin tmp := SeriesX.Clicked(x, y);/返回该点的所在的series上序号，从0开始。 if tmp = -1 then /没有点中曲线上的点。 labelText := else begin MarkText := 序号： FloatToStr(SeriesX.XValuetmp) #13 数值：; MarkText := labelText FormatFloat(#,#0.#,SeriesX.YValuetmp) #13 XUCL： FormatFloat(#,#0.#,XUCL); MarkText := labelText #13 XCL ： FormatFloat(#,#0.#,XCL) #13 XLCL： FormatFloat(#,#0.#,XLCL); end; end; 再在marktipstools的GetText事件中添加代码，修改要显示的值。 procedure TfrmVChart.ChartTool1GetText(Sender: TMarksTipTool; var Text: string); begin Text := MarkText; end; 1.7 自定义轴的标签（Label） procedure TAxisItemsDemo.FormCreate(Sender: TObject); begin inherited; Series1.AddArray(200,0,123,300,260,-100,650,400);/添加数据 AddCustomLabels; end; Procedure TAxisItemsDemo.AddCustomLabels; begin with Chart1.Axes.Left do begin Items.Clear; / remove all custom labels/删除原有的标签。 / add custom labels Items.Add(123,Hello).Font.Size:=16; Items.Add(466,Good#13Bye).Transparent:=False; Items.Add(300); with Items.Add(-100) do /标签的一些属性。 begin Transparent:=False; Transparency:=50; Color:=clBlue; end; end; end; 1.8 teefunction，自定义函数的功能。 属性：munPoints：计算次数 Period：两次计算之间的x值的增量 starX：X的开始值。 periodStyle:period的方式，当是datetime类型时，很有用。如：Period：DateTimeStep dtOneMonth ，或DateTimeStep dtOneDay 1.9 teefunction的periodStyle So, for example you can now plot the, for example, monthly average of sales function just using a normal Average function on a date-time source series and setting the function period to one month : Place a Series1 and fill it with datetime data values at runtime (or from a database) Series2.SetFunction( TAverageTeeFunction.Create ) ; Series2.FunctionType.PeriodStyle:=psRange; Series2.FunctionType.Period:=DateTimeStep dtOneMonth ; Series2.DataSource:=Series1 ; This will result in several points, each one showing the average of each month of data in Series1. Its mandatory that points in the source Series1 should be sorted by date when calculating functions on datetime periods. The range can also be used for non-datetime series: Series2.SetFunction( TAverageTeeFunction.Create ) ; Series2.FunctionType.PeriodStyle