Karena versi TeeChart VCL banyak digunakan di berbagai lingkungan pengembangan dan dikenal dengan baik, perusahaan Spanyol Steema Software SL mengembangkan TeeChart Pro ActiveX pada bulan Oktober 1997. Tidak diragukan lagi ini merupakan kabar baik bagi model pengembangan B/S Karena hanya perlu diinstal di sisi server, klien tidak perlu menginstal perangkat lunak lain. Oleh karena itu, grafik statistik dapat ditampilkan menggunakan browser umum diluncurkan, sekali lagi mendapatkan popularitas yang luar biasa.
Selanjutnya, kami akan memperkenalkan properti umum dan aplikasi komponen TeeChart Pro V5 ActiveX berdasarkan teknologi ASP.
Pertama mari kita lihat contoh diagram batang dua dimensi yang menggunakan komponen TeeChart untuk menampilkan "penjualan triwulanan":
<HTML><BODY>
<%'-----------TeeChartEg.asp--- - --------------------
Set TChart1 = CreateObject("TeeChart.TChart")
TChart1.Header.Text(0)="Statistik Penjualan Kuartalan"
TChart1.AddSeries( 1)
TChart1.Aspect.View3D=0
TChart1.Series(0).Hapus
TChart1.Series(0).Tambahkan 180, "1 Kuartal",RGB(35,70,128)
TChart1.Series(0).Tambahkan 240, "2 Kuartal",RGB(255,80,128)
TChart1.Series(0).Tambahkan 210, "3 Kuartal",&HFACE87
TChart1.Series(0).Tambahkan 280, "4 Kuartal",16777215
TChart1.Export.SaveToJPEGFile server.mappath( "MyChart.jpg"),False,JPEGBestQuality,100,TCart1.Width, TChart1.Height
Set TChart1 = tidak ada
%>
<img src="MyChart.jpg">
</BODY></HTML>
1) Sama seperti ASP lainnya komponen Cara penggunaannya sama, buat objeknya terlebih dahulu.
Setel TChart1 = CreateObject("TeeChart.TChart")
2) Gunakan propertinya untuk menampilkan grafik statistik statis.
TChart1.Header.Text(0)="Statistik Penjualan Kuartalan"
...
TChart1.Series(0).Tambahkan 210, "Kuartal ke-3",&HFACE87
TChart1.Series(0).Tambahkan 280, "Kuartal ke-4",16777215
3 ) Hasilkan file grafik statistik
TChart1.Export.SaveToJPEGFile server.mappath("MyChart.jpg"),False,JPEGBestQuality,100,TChart1.Width, TChart1.Height
4) Lepaskan objek
Set TChart1 = tidak ada
Banyak atribut kelas objek di contoh di atas Ini semua adalah nilai default, dan kita dapat menambahkan pengaturan sesuai dengan keadaan tertentu. Berikut adalah pengenalan rinci tentang properti umum lainnya dari komponen TeeChart (tercantum dalam bentuk komentar program)
<HTML> <HEAD><TITLE>Pengantar metode properti objek TeeChart</TITLE></HEAD>
< BODY>
<%
Set TChart1 = CreateObject("TeeChart.TChart")
TChart1.Height = 440 'Tinggi seluruh diagram
TChart1.Width = 500 'Lebar seluruh diagram'TCart1.Header.Text.Clear
'
TChart1. Header.Text.Tambahkan "Quarterly Sales Statistics" 'Judul chart, caranya juga bisa berupa TChart1.Header.Text(0)="title"
TChart1.Header.Font.Size = 22' Ukuran font judul
TChart1. Header.Font.Bold = True 'Apakah font judulnya
tebalTChart1 .Header.Font.Italic = Benar ' Apakah font judulnya miring
TChart1.Panel.MarginLeft = 3 ' Margin kiri grafik
TChart1.Panel.Gradient.Visible = Benar ' Apakah ada warna latar belakang
TChart1.Panel.Gradient.StartColor = &HB3DEF ' Bagian bawah bagan Warna warna awal
TChart1.Panel.Gradient.EndColor = &HFACE87 ' Warna latar belakang bagan warna akhir
TChart1.Panel.BevelWidth = 0 ' Lebar lekukan kanvas
TChart1.AddSeries(0) ' Cara menampilkan grafik, rentang nilainya adalah 1 ~ 39
TChart1.Aspect.View3D = False ' False mewakili grafik 2D, True mewakili grafik 3D
TChart1.Aspect.Chart3DPercent = 10 ' Jika adalah grafik 3D, mewakili kemiringannya
TChart1.Aspect.Zoom = 100 ' Rasio tampilan grafis
TChart1.Aspect.Orthogonal = TRUE 'Apakah grafik 3D diputar ke samping
TChart1.Aspect.Rotation = -20 'Jika grafik diputar ke samping , sudut rotasi horizontal adalah -360~360
TChart1.Aspect.Elevation = 0 'Jika grafik diputar ke samping, putar Sudut depan dan belakang -360~360
TChart1.Aspect.Perspective = 0 ' Derajat agregasi sentripetal grafik 3D
TChart1.Aspect .Chart3DPercent = 20' Ketebalan grafik 3D 1~100
TChart1.Walls.Bottom.Size = 5' Jika grafik 3D, ini menunjukkan ketebalan Absisnya
TChart1.Walls.Bottom.Color = RGB(35,70,128) ' Warna dasar
TChart1.Walls.Bottom.Transparent = True ' Jika grafik 3D, apakah alasnya transparan TChart1.Walls.Back.Pen.Visible = True ' Parameter Apakah batas koordinat ditampilkan
TChart1.Walls.Left.Size = 5 ' Jika grafik 3D, menunjukkan ketebalan ordinatnya
TChart1.Walls.Left.Color = 8454143 ' Warna ordinat
TChart1.Walls.Left.Transparent = True ' Jika grafik 3D , apakah dinding ordinatnya transparan
TChart1 .Legend.Visible = True ' Apakah akan menampilkan legenda
TChart1.Legend.VertSpacing = 9 ' Ketinggian bingkai legenda
TChart1.Legend.DividingLines.Visible = False ' Apakah terdapat garis spasi di antara legenda
' TChart1.Series(0 ) .Clear
'TCart1.Series(0).ColorEachPoint = True
'TCart1.Series(0).Add 180,"1 Quarter",RGB(35,70,128) ' Secara statis menambahkan data tampilan ke grafik, parameternya adalah nilai numerik secara berurutan, nama, warna'TCart1.Series
(0).Tambahkan 240, "2 Quarter",255
'TCart1.Series(0).Tambahkan 210, "3 Quarter",&HFACE87
TChart1.Series(0).Tambahkan 280 , "4 Quarter",16777215
TChart1.Axis.Depth.Visibl e= False ' Ketika sumbu koordinat transparan 3D, apakah akan menampilkan dinding bagian dalam
TChart1.Axis.DrawAxesBeforeSeries = False ' Apakah grid ditampilkan di depan grafik
TChart1.Axis.Left.Title.Caption = "Nilai keluaran (satuan: 10.000 yuan)" ' Judul sumbu vertikal
TChart1.Axis.Left.Title.Font.Bold = Benar ' Judul sumbu vertikal apakah TChart1.Axis.Left dicetak tebal
. Title.Font.Size = 9 ' Ukuran judul sumbu vertikal
TChart1.Axis.Left.Title.Visible = True ' Apakah akan menampilkan nama sumbu vertikal
TChart1.Axis.Left.Labels.Angle = 90 ' Sudut kemiringan font sumbu vertikal
TChart1. Axis.Left.GridPen.Visible = True ' Apakah sumbu parameter absis menampilkan
TChart1.Axis.Bottom.Title.Caption = "Time Axis" ' Apakah judul sumbu absis
TChart1.Axis.Bottom.Title.Font.Bold = True ' Apakah judul sumbu absis dicetak tebal
TChart1.Axis .Bottom.Title.Font.Size= 9 'Ukuran judul sumbu absis
TChart1.Axis.Bottom.Labels.Angle = 0 'Sudut kemiringan font absis 0~360
TChart1.Axis.Bottom. GridPen.Visible = True ' Parameter vertikal Apakah sumbu koordinat menampilkan
TChart1.Footer.Text.Tambahkan "Judul bawah bagan" 'Judul bawah bagan
TChart1.Footer.Font.Size = 11 'Ukuran font judul bawah
TChart1 .Footer.Font.Bold = True 'Apakah font judul bawah adalah Bold
TChart1.Footer.Font.Italic = False 'Apakah font judul bawah adalah italic
TChart1.Export.SaveToJPEGFile server.mappath("MyChart.jpg") ,False,JPEGBestQuality, 100, TChart1.Width, TChart1.Height 'Ekspor penyimpanan
Set TChart1 = tidak ada
%>
untuk file MyChart.jpg <img src="MyChart.jpg"></BODY></HTML>
Catatan: 1 . Properti mode tampilan grafis TChart1.AddSeries(0) patut dipelajari. Pembaca yang tertarik dapat mengujinya dari 0 hingga 39 untuk menemukan metode tampilan idealnya.
2. Untuk referensi warna digunakan tiga metode representasi RGB, misalnya: RGB(255,255,255) = &HFFFFFF = 16777215. Metode konversi spesifiknya tidak dijelaskan.
3. Properti Benar dan Salah dapat diwakili oleh 1 dan 0.
Untuk penambahan grafik grup, berikut contoh menampilkan dua kelompok data.
<%Set TChart1 = CreateObject("TeeChart.TChart")
TChart1.Header.Text(0)="Volume Penjualan Kuartalan"'Judul
TChart1.AddSeries(1)
TChart1.AddSeries(1)
TChart1.Series(0).Tambahkan 180 , "Kuartal 1",RGB(255.255.255)
TChart1.Series(1).Tambahkan 240, "Kuartal 1",255
TChart1.Series(0).Tambahkan 280, "Kuartal 2",RGB(255.255.255)
TChart1.Series(1 ).Tambahkan 200, "Kuartal ke-2",255
TChart1.Series(0).Tambahkan 150, "Kuartal ke-3",RGB(255,255,255)
TChart1.Series(1).Tambahkan 320, "Kuartal ke-3",255
TChart1.Series( 0).Tambahkan 360, "4 Quarters",RGB(255,255,255)
TChart1.Series(1).Tambahkan 200, "4 Quarters",255
TChart1.Series(0).Marks.Visible = True ' Apakah akan menampilkan judul data
TChart1.Series(0).Marks.Style = 0 'Gaya tampilan data 0~9, 0 adalah nilai numerik, 1 adalah persentase...
TChart1.Series(1).Marks.Style=0
TChart1.Export.SaveToJPEGFile server. mappath("MyChart .jpg"),False,JPEGBestQuality,100,TChart1.Width, TChart1.Height
Set TChart1 = tidak ada
%>
Dua contoh di atas secara statis menghasilkan hasil statistik dan kemudian menampilkannya. Namun pada kenyataannya, tampilan data statistik lebih dinamis dibaca dari database yang ada. Di bawah ini kami memberikan contoh penggunaan ADO untuk menyambung langsung ke database Access dan menampilkan hasilnya secara dinamis. Basis datanya adalah (test.mdb), dan dua kolom tabelnya adalah colname dan colvalue. Itu adalah nama bulan dan nama kolom data statistik yang terkait (Januari, Februari,...), nilai nilai (103, 210,...):
<%Dim OutputStream
Set TChart1 = CreateObject("TeeChart.TChart")
TChart1.Header . Text(0)="Volume Penjualan Kuartalan"'Judul
TChart1.AddSeries(0)'Nilai gaya grafik yang ditampilkan adalah 1~39, lihat di bawah
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 = "pilih * dari pengujian"
Pertama. Buka strsql,conn ,1,1
JIKA rst.RecordCount > 0 MAKA
TChart1.Series(0).Datasource = pertama
TChart1.Series(0).LabelsSource="colname"
TChart1.Series(0).YValues.ValueSource="colvalue "
ELSE
TChart1.Series(0).Fillsamplevalues(12)
TChart1.Header.Text(0)="Tidak ada hasil, tampilkan data secara acak"
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 = tidak ada
Rst.Close
Set Conn = tidak ada
%> <img src="MyChart .jpg">
Ketiga contoh di atas semuanya ditampilkan setelah menghasilkan file gambar JPG statis. Jika tidak ada gunanya menyimpan hasil penelusuran, kita dapat menggunakan PNG (Portable Network Graphics) untuk menampilkannya.
<% Redupkan ChartType, OutputStream, ViewType
Set Chart1 = CreateObject("TeeChart.TChart")
Chart1.AddSeries(0)
Chart1.Series(0).FillSampleValues 20 ' Menghasilkan data secara acak
OutputStream=Chart1.Export.asPNG.SaveToStream
Set Chart1= Nothing
Response.Binarywrite OutputStream
%>
Di atas adalah pengenalan singkat tentang kombinasi atribut komponen TeeChart dan teknologi ASP. Saya harap ini dapat bermanfaat bagi semua orang. Versi uji coba gratis Teechart Pro ActiveX dapat diunduh dari http://www.steema.com/download/Downloadindex.htm . Untuk contoh kode penggabungan TeeChart dengan Asp, silakan merujuk ke http://www.steema.com/products/teechart/asp/ASPHome.htm .