由于TeeChart VCL 版本廣泛應用于多種開發環境并得到很好的認可,西班牙Steema Software SL公司于1997年10月又開發了TeeChart PRo ActiveX。對于B/S的開發模式無疑是一個好消息,由于它只需安裝在服務器端,客戶端無需安裝其他軟件,只要使用通用瀏覽器即可顯示統計圖形,因此一面市更是又一次得到極大的歡迎。
%20下面我們結合asp技術介紹一下TeeChart%20Pro%20V5%20ActiveX組件常用屬性及應用。
%20我們先來看一個以TeeChart組件來顯示"季度銷售量"情況的二維柱狀圖實例:
<HTML><BODY>
<%’-----------TeeChartEg.asp------------------------
%20Set%20TChart1%20=%20CreateObject("TeeChart.TChart")%20
%20TChart1.Header.Text(0)="季度銷售量統計" %20
%20TChart1.AddSeries(1)
%20TChart1.Aspect.View3D=0
%20TChart1.Series(0).Clear%20
%20TChart1.Series(0).Add%20180,%20"1季度",RGB(35,70,128)%20
%20TChart1.Series(0).Add%20240,%20"2季度",RGB(255,80,128) %20
%20TChart1.Series(0).Add%20210,%20"3季度",&HFACE87%20
%20TChart1.Series(0).Add%20280,%20"4季度",16777215%20
%20TChart1.Export.SaveToJPEGFile%20server.mappath("MyChart.jpg"),False,JPEGBestQuality,100,TChart1.Width, TChart1.Height
Set TChart1 = nothing
%>
<img src="MyChart.jpg">
</BODY></HTML>
1)同ASP其他組件的使用方法相同,首先創建對象。
Set TChart1 = CreateObject("TeeChart.TChart")
2)利用其屬性顯示一個靜態的統計圖形。
TChart1.Header.Text(0)="季度銷售量統計"
……
TChart1.Series(0).Add 210, "3季度",&HFACE87
TChart1.Series(0).Add 280, "4季度",16777215
3)生成統計圖形文件
TChart1.Export.SaveToJPEGFile server.mappath("MyChart.jpg"),False,JPEGBestQuality,100,TChart1.Width, TChart1.Height
4)釋放對象
Set TChart1 = nothing
上例中對象類的很多屬性都是默認值,我們可以根據具體情況進行添加設置。下面詳細介紹一下TeeChart組件的其他常用屬性(采用程序注釋的形式列出)
<HTML> <HEAD><TITLE>TeeChart對象的屬性方法介紹</TITLE></HEAD>
<BODY>
<%
Set TChart1 = CreateObject("TeeChart.TChart")
TChart1.Height = 440 ' 整個圖表的高度
TChart1.Width = 500 ' 整個圖表的寬度
'TChart1.Header.Text.Clear
'TChart1.Header.Text.Add "季度銷售量統計" ' 圖表標題,方式也可采用 TChart1.Header.Text(0)="標題"形式
TChart1.Header.Font.Size = 22 ' 標題字體大小
TChart1.Header.Font.Bold = True ' 標題字體是否粗體
TChart1.Header.Font.Italic = True ' 標題字體是否斜體
TChart1.Panel.MarginLeft = 3 ' 圖表左邊距
TChart1.Panel.Gradient.Visible = True ' 是否有底色
TChart1.Panel.Gradient.StartColor = &HB3DEF ' 圖表底色開始顏色
TChart1.Panel.Gradient.EndColor = &HFACE87 ' 圖表底色結束顏色
TChart1.Panel.BevelWidth = 0 ' 畫布向內縮進幅度
TChart1.AddSeries(0) ' 顯示圖形的方式,取值范圍為1 ~ 39
TChart1.Aspect.View3D = False ' False表示2D圖形,True表示3D圖形
TChart1.Aspect.Chart3DPercent = 10 ' 若是3D圖形,表示其傾斜度
TChart1.Aspect.Zoom = 100 ' 圖形顯示比例
TChart1.Aspect.Orthogonal = TRUE ' 3D圖表是否側轉
TChart1.Aspect.Rotation = -20 ' 如果圖表是側轉的,水平側轉角度-360~360
TChart1.Aspect.Elevation = 0 ' 如果圖表是側轉的,前后側轉角度-360~360
TChart1.Aspect.Perspective = 0 ' 3D圖形向心聚集程度
TChart1.Aspect.Chart3DPercent = 20 ' 3D圖形厚度1~100
TChart1.Walls.Bottom.Size = 5 ' 如果是3D圖形,表示其橫坐標厚度
TChart1.Walls.Bottom.Color = RGB(35,70,128) ' 底座顏色
TChart1.Walls.Bottom.Transparent = True ' 若是3D圖形,底座是否透明 TChart1.Walls.Back.Pen.Visible = True ' 參坐標邊框是否顯示
TChart1.Walls.Left.Size = 5 ' 如果是3D圖形,表示其縱坐標厚度
TChart1.Walls.Left.Color = 8454143 ' 縱坐標顏色
TChart1.Walls.Left.Transparent = True ' 若是3D圖形,縱坐標壁是否透明
TChart1.Legend.Visible = True ' 是否顯示圖例
TChart1.Legend.VertSpacing = 9 ' 圖例框架高度
TChart1.Legend.DividingLines.Visible = False ' 圖例間是否有間隔線
'TChart1.Series(0).Clear
'TChart1.Series(0).ColorEachPoint = True
'TChart1.Series(0).Add 180,"1季度",RGB(35,70,128) ' 靜態向圖表中添加顯示數據,參數依次為數值大小,名稱,顏色
'TChart1.Series(0).Add 240, "2季度",255
'TChart1.Series(0).Add 210, "3季度",&HFACE87
TChart1.Series(0).Add 280, "4季度",16777215
TChart1.Axis.Depth.Visibl e= False ' 坐標軸是3D透明時,是否顯示內壁
TChart1.Axis.DrawAxesBeforeSeries = False ' 網格是否顯示在圖的前
TChart1.Axis.Left.Title.Caption = "產值(單位:萬元)" ' 縱坐標軸標題
TChart1.Axis.Left.Title.Font.Bold = True ' 縱坐標軸標題是否加粗
TChart1.Axis.Left.Title.Font.Size = 9 ' 縱坐標軸標題大小
TChart1.Axis.Left.Title.Visible = True ' 是否顯示縱坐標名稱
TChart1.Axis.Left.Labels.Angle = 90 ' 縱坐標字體傾斜角度
TChart1.Axis.Left.GridPen.Visible = True ' 橫坐標參量軸是否顯示
TChart1.Axis.Bottom.Title.Caption = "時間軸" ' 橫坐標軸標題
TChart1.Axis.Bottom.Title.Font.Bold = True ' 橫坐標軸標題是否加粗
TChart1.Axis.Bottom.Title.Font.Size= 9 ' 橫坐標軸標題大小
TChart1.Axis.Bottom.Labels.Angle = 0 ' 橫坐標字體傾斜角度0~360
TChart1.Axis.Bottom.GridPen.Visible = True ' 參縱坐標軸是否顯示
TChart1.Footer.Text.Add "圖表下標題" ' 圖表的下標題
TChart1.Footer.Font.Size = 11 ' 下標題字體大小
TChart1.Footer.Font.Bold = True ' 下標題字體是否為粗體
TChart1.Footer.Font.Italic = False ' 下標題字體是否為斜體
TChart1.Export.SaveToJPEGFile server.mappath("MyChart.jpg"),False,JPEGBestQuality, 100 , TChart1.Width , TChart1.Height '導出存儲為MyChart.jpg文件
Set TChart1 = nothing
%> <img src="MyChart.jpg">
</BODY></HTML>
注:1. TChart1.AddSeries(0)圖形顯示方式的屬性值得研究,有興趣的讀者可以從0~39測試一下,找到自己理想的顯示方式。
2.對于顏色的引用,采用RGB三種表示方法,例如:RGB(255,255,255) = &HFFFFFF = 16777215。具體的換算方法不在說明。
3.屬性為True和False的可以用1和0替代表示。
對于組圖的添加,下面列舉一個顯示二組數據的例子。
<%Set TChart1 = CreateObject("TeeChart.TChart")
TChart1.Header.Text(0)="季度銷售量"'標題
TChart1.AddSeries(1)
TChart1.AddSeries(1)
TChart1.Series(0).Add 180, "1季度",RGB(255,255,255)
TChart1.Series(1).Add 240, "1季度",255
TChart1.Series(0).Add 280, "2季度",RGB(255,255,255)
TChart1.Series(1).Add 200, "2季度",255
TChart1.Series(0).Add 150, "3季度",RGB(255,255,255)
TChart1.Series(1).Add 320, "3季度",255
TChart1.Series(0).Add 360, "4季度",RGB(255,255,255)
TChart1.Series(1).Add 200, "4季度",255
TChart1.Series(0).Marks.Visible = True ' 是否顯示數據標題
TChart1.Series(0).Marks.Style = 0 ' 數據顯示風格0~9,0為數值,1為百分比……
TChart1.Series(1).Marks.Style=0
TChart1.Export.SaveToJPEGFile server.mappath("MyChart.jpg"),False,JPEGBestQuality,100,TChart1.Width, TChart1.Height
Set TChart1 = nothing
%>
以上兩個例子都是靜態的產生統計結果,然后顯示。然而在實際工作中,更多的是從現有的數據庫中讀取動態的統計數據顯示。下面我們舉一個利用ADO直接連接access數據庫,動態顯示結果的例子。數據庫為(test.mdb),表的兩列為colname,colvalue。分別為月份名稱和對應的統計數據colname(1月份,2月份,……),colvalue(103,210,……):
<%Dim OutputStream
Set TChart1 = CreateObject("TeeChart.TChart")
TChart1.Header.Text(0)="季度銷售量"'標題
TChart1.AddSeries(0)'顯示圖形的風格數值為1 ~39見下
Set Conn=Server.CreateObject("ADODB.Connection")
Set Rst=Server.CreateObject("ADODB.Recordset")
Conn.Open "driver={microsoft access driver (*.mdb)};dbq="&server.mappath("zcw.mdb")
strsql = "select * from test"
Rst.Open strsql,conn,1,1
IF rst.RecordCount > 0 THEN
TChart1.Series(0).Datasource = rst
TChart1.Series(0).LabelsSource="colname"
TChart1.Series(0).YValues.ValueSource="colvalue"
ELSE
TChart1.Series(0).Fillsamplevalues(12)
TChart1.Header.Text(0)="沒有結果,隨機顯示數據"
END IF
TChart1.Series(0).Marks.Visible=True
TChart1.Series(0).Marks.Style=4
TChart1.Export.SaveToJPEGFile server.mappath("MyChart.jpg"),False,JPEGBestQuality,100,TChart1.Width, TChart1.Height
Set TChart1 = nothing
Rst.Close
Set Conn = nothing
%> <img src="MyChart.jpg">
以上的三個實例都是生成靜態JPG圖片文件后顯示的,如果對于瀏覽結果沒有保存價值,我們可以使用PNG(Portable Network Graphics)方式顯示。
<% Dim ChartType, OutputStream, ViewType
Set Chart1 = CreateObject("TeeChart.TChart")
Chart1.AddSeries(0)
Chart1.Series(0).FillSampleValues 20 ' 隨機生成數據
OutputStream=Chart1.Export.asPNG.SaveToStream
Set Chart1=Nothing
Response.Binarywrite OutputStream
%>
以上是對TeeChart組件屬性與ASP技術結合的簡單介紹,希望對大家有所幫助。Teechart Pro ActiveX免費試用版本可從http://www.steema.com/download/Downloadindex.htm下載。關于TeeChart與Asp結合的代碼示例可參閱http://www.steema.com/products/teechart/asp/ASPHome.htm。
新聞熱點
疑難解答