Anda di halaman 1dari 99
Spesifikasi: Ukuran: 14x21 cm Tebal: 358 hlm Harga: Rp 53.800 Terbit pertama: November 2004 Sinopsis

Spesifikasi:

Ukuran: 14x21 cm Tebal: 358 hlm Harga: Rp 53.800 Terbit pertama: November 2004 Sinopsis singkat:

Membangun suatu sistem akuisisi besaran analog mutlak memerlukan perangkat lunak (software) yang khusus agar sesuai kebutuhan analisis. Saat ini sudah banyak perangkat lunak untuk menganalisis sinyal-sinyal hasil pengukuran (software) yang dijual. Melalui buku ini, penulis mencoba membangun sebuah perangkat lunak (software) yang dapat Anda gunakan untuk keperluan akuisisi data.

Sistem akuisisi data yang dibangun berbasis pada database dengan pernyataan Local SQL. Data masukan dapat diatur agar berasal dari antarmuka ADC, ditampilkan secara online dalam bentuk grafik dengan komponen TChart, dan juga dalam bentuk teks. Data tersebut dapat disimpan dalam suatu file database, dicari nilai statistiknya, dan dicetak. Dengan mengganti sumber data, sistem akuisisi data ini juga dapat diterapkan dalam bidang lain, misalnya ekonomi.

Buku ini juga menyertakan topik-topik tambahan yang berhubungan dengan akuisisi data secara grafis dengan komponen TChart, TDBChart, atau Timage, dan membuat file setup suatu aplikasi.

BAB 3

BEBERAPA TOPIK TAMBAHAN UNTUK SUATU APLIKASI

Topik-topik tambahan yang akan dipaparkan berikut ini adalah untuk suatu aplikasi akuisisi data dengan komponen TChart. Beberapa topik dapat ditambahkan dalam setting program aplikasi Sistem Akuisisi Data pada Bab 2 dan sebagian yang lain merupakan aplikasi tambahan yang dapat diterapkan pada aplikasi yang lain. Manfaatkan form FOtherDemo (tersimpan dalam unit UOtherDemo) yang telah dibuat pada Bab 1 untuk menampung topik-topik tersebut. Untuk membuat suatu topik, dibuat form baru.

3.1 Mendesain Form FOtherDemo

Pada form FOtherDemo, letakkan sebuah komponen TImage, 2 (dua) buah komponen TGroupBox, 2 (dua) buah komponen TLabel, 4 (empat) buah komponen TSpeedButton, dan 10 (sepuluh) buah komponen TRadioButton. Kemudian, ubahlah property komponen-komponen tersebut seperti tabel berikut ini (untuk property yang mempunyai nilai lebih dari satu, masing-

169

masing dipisahkan oleh tanda titik koma Sesuaikan berdasarkan

urutan property Name):

Nama Object

Nama Property

Nilai

TForm

AutoSize

True

BorderStyle

bsNone

Name

FOtherDemo

Position

poScreenCenter

Timage (tab

AutoSize

True

Additional)

Name

IOtherDemo

 

Picture

Klik ganda sel disebelah kanan property ini, load gambar IOtherDemo.jpg

TgroupBox

Caption

Expand; Features

(tab Standard)

Color

clWhite

sebanyak 2

buah

Font.Color

clRed

Font.Name

Arial

Font.Size

9

Font.Style.fsBold

True

Height

91; 154

Name

GBExpand; GBFeatures

Visible

False

Width

190

Tlabel (tab

AutoSize

True; False

Standard)

Caption

Read this : ; (bebas)

sebanyak 2

buah. Pasang

Font.Color

clRed; clBlack

pada form

Font.Name

Arial

170

 

Font.Size

8

Font.Style.fsBold

True; False

Height

14; 103

Left

138; 146

Name

Label1; LNotes

Top

215; 233

Transparent

True

Width

57; 201

WordWrap

False; True

TSpeedButton

Caption

(kosongkan); Expand

(tab

Form; Features The Demo !

;

Show me

Additional)

 

sebanyak 4

 

Cursor

crHandPoint

 

buah. Pasang

dalam form

Flat

True

Font.Color

(bebas); clYellow; clYellow; clBlue

Font.Name

Arial

Font.Size

9

Font.Style.fsBold

True

Glyph

Klik ganda sel disebelah kanan property ini, load gambar BExit.bmp; (kosongkan untuk selain BClose)

Height

12; 18; 18; 18

Left

346; 10; 10; 216

Margin

-1; 5; 5; 5

171

 

Name

BClose; BExpand; BFeatures; Bshow

Top

1; 27; 47; (bebas)

Width

12; 127; 127; 129

TradioButton

Caption

Cross Hair; Keyboard Scrolling; Property BackImage

(tab Standard)

sebanyak 3

buah. Pasang

   

pada

Checked

True; False; False

GBExpand

Color

clWhite

Left

18

Name

RCrossHair; RKeyboard; RBackImage

Top

24

TradioButton

Caption

Digital Chart; Fast Line Series; Linked Tables; Mini Small Charts; Property Paging; Statistical Bar Series; Osiloscope with TImage

(tab Standard)

sebanyak 7

buah.

Pasang pada

GBFeatures

Checked

False untuk selain RDigital

Color

clWhite

Left

18

Name

RDigital; RFastLine; RLinked; RMini; RPaging; RStatistic; ROsciloscope

Top

24; 41; 58; 75; 92; 110; 128

Biarkan nilai-nilai property yang lain sesuai nilai default-nya.

172

Prosedur Event OnMouseDown pada TImage (IOtherDemo)

Form FOtherDemo tidak dapat digeser karena property BorderStyle bernilai bsNone. Untuk mengatasinya, buat event OnMouseDown pada komponen TImage. Klik ganda sel di sebelah kanan event OnMouseDown komponen tersebut dan ketikkan kode programnya.

procedure TFOtherDemo.IOtherDemoMouseDown(Sender: TObject; Button: TMouseButton; Shift: TShiftState; X, Y: Integer); begin ReleaseCapture; TWinControl(FOtherDemo).Perform(WM_SysCommand, $F012, 0); end;

Prosedur Event OnClose pada TForm (FOtherDemo)

Prosedur event OnClose berguna untuk menangani kejadian pada saat form ditutup, yaitu menampilkan kembali form FMainDemo yang telah disembunyikan saat form ini dibangkitkan. Pada tab event TForm, klik ganda sel di sebelah kanan OnClose dan ketik kode programnya.

procedure TFOtherDemo.FormClose (Sender: TObject; var Action:

TCloseAction);

begin

FMainDemo.Show;

end;

Prosedur Event OnClick pada Komponen TSpeedButton (BClose)

Komponen TSpeedButton BClose berfungsi untuk menutup form FOtherDemo kemudian menampilkan kembali form FMainDemo (yaitu memanggil prosedur event OnClose yang telah dibuat). Klik ganda sel di sebelah kanan event OnClick komponen tersebut kemudian ketikkan prosedur Close pada prosedur BCloseClick.

procedure TFOtherDemo.BCloseClick (Sender: TObject); begin Close; end;

Prosedur Event OnCreate pada TForm (FOtherDemo)

Posisi beberapa komponen yang terpasang dalam form FOtherDemo dapat ditentukan dalam prosedur event OnCreate.

173

Pada tab event TForm, klik ganda sel di sebelah kanan OnCreate dan ketikkan kode program berikut ini.

procedure TFOtherDemo.FormCreate(Sender: TObject);

procedure Position(AOwner: TControl; ax,ay : integer); begin AOwner.Left:= ax; AOwner.Top:= ay; end; begin Position(GBExpand, 157, 22); Position(GBFeatures, 157, 22); ButtonClick(BExpand); end;

Prosedur lokal Position digunakan untuk meringkas penulisan posisi kiri dan atas beberapa komponen dan prosedur ButtonClick dengan sender BExpand menyebabkan komponen TGroupBox GBExpand beserta komponen yang terpasang di dalamnya ditampilkan ketika form pertama kali dibangkitkan. Jika menginginkan keadaan tersebut terjadi setiap kali form dipanggil, deklarasikan dalam event OnShow form.

Prosedur Event OnClick pada Komponen TSpeedButton (BExpand dan BFeatures)

Menu-menu yang ada dalam form FOtherDemo terbagi dalam kelompok Expand dan Features. Kelompok pertama berisi menu yang dapat ditambahkan dalam setting program aplikasi Sistem Akuisisi Data yang telah dibuat dan menu yang kedua berisi topik untuk membuat aplikasi lain. Manfaatkan komponen TSpeedButton BExpand dan BFeatures untuk menampilkan menu- menu dalam komponen TGroupBox. Blok kedua komponen TSpeedButton tersebut, isi sel di sebelah kanan event OnClick dengan nama prosedur ButtonClick kemudian tekan tombol Enter.

procedure TFOtherDemo.ButtonClick(Sender: TObject); begin GBExpand.Visible:= False; GBFeatures.Visible:= False; if Sender = BExpand then begin GBExpand.Visible:= True; BShow.Top:= 124; end else begin GBFeatures.Visible:= True; BShow.Top:= 184; end;

174

end;

Kelompok menu dalam komponen TGroupBox akan ditampilkan berdasarkan sender prosedur ButtonClick, termasuk posisi atas komponen TSpeedButton BShow.

Prosedur Event OnMouseMove pada Semua Komponen

Komponen TLabel LNotes berfungsi untuk menginformasikan keterangan suatu komponen ketika mouse bergerak di atas komponen tersebut melalui event OnMouseMove. Blok semua komponen yang tertampung dalam form FOtherDemo, isi pada sel sebelah kanan tab event OnMouseMove dengan nama prosedur Notes, lalu tekan tombol Enter.

procedure TFOtherDemo.Notes(Sender: TObject; Shift: TShiftState; X, Y: Integer); begin LNotes.Caption:= ''; if Sender = BExpand then LNotes.Caption := 'Merupakan ekspansi setting program, '+ 'seperti Cross Hair, kontrol scrolling grafik dengan '+ 'tombol Keyboard, dan mengubah property BackImage '+ 'komponen TChart.'; if Sender = BFeatures then LNotes.Caption := 'Feature yang dapat diterapkan dalam '+ 'suatu aplikasi, terdiri atas : Digital Chart, Ploting '+ 'data Series bertipe Fast Line, Akses database dengan '+ 'komponen TTable, Mini Chart yang Resizeable, ‘+ ‘Property Paging, Nilai Statistik dalam TChartSeries, '+ 'dan membuat Osciloscope dengan komponen TImage.'; if Sender = RCrossHair then LNotes.Caption := 'Membuat garis Cross-Hair pada grafik.'; if Sender = RKeyboard then LNotes.Caption := 'Mengontrol proses zoom dan scrolling '+ 'grafik dengan menggunakan tombol-tombol Keyboard.'; if Sender = RBackImage then LNotes.Caption := 'Mengeset gambar background grafik '+ '(property BackImage).'; if Sender = RDigital then LNotes.Caption := 'Simulasi plot data digital pada grafik.'; if Sender = RFastLine then LNotes.Caption := 'Mengukur kecepatan plot data pada TChartSeries bertipe Fast Line.'; if Sender = RLinked then LNotes.Caption := 'Menghubungkan TChartSeries komponen '+ 'TDBChart dengan dataset komponen TTable.'; if Sender = RMini then LNotes.Caption := 'Membuat grafik mini yang dapat diubah '+ 'ukurannya mengikuti perubahan ukuran form dan membuat '+ 'garis divider vertikal pada suatu TChartSeries.'; if Sender = RPaging then LNotes.Caption := 'Membagi grafik dalam halaman tertentu '+

175

'dan scrolling grafik per halaman.'; if Sender = RStatisticBar then LNotes.Caption := 'Membuat nilai statistik pada '+ 'TChartSeries dan membuat TChartSeries '+ 'bertipe Bar secara run-time.'; if Sender = ROsciloscope then LNotes.Caption := 'Membuat sistem pengukuran data dengan'+ 'menggunakan komponen TImage.'; end;

Jika mouse berada di atas komponen yang menjadi sender prosedur Notes, property Caption komponen LNotes akan menampilkan keterangan untuk setiap komponen tersebut. Jika berada di luar komponen-komponen tersebut, tidak ada teks yang ditampilkan.

3.2 Membuat Garis Cross-Hair

Garis Cross-Hair merupakan garis silang pada „kotak‰ grafik ketika mouse berada di atas grafik tersebut dan posisinya akan berubah mengikuti perubahan posisi mouse. Garis Cross-Hair dapat dipakai untuk mengetahui nilai suatu titik dalam grafik. Buatlah sebuah form baru dengan nama FCrossHair dan simpan nama unit dalam UCrossHair. Pada form tersebut, pasang sebuah komponen TChart, komponen TLabel, komponen TPanel, komponen TCheckBox, dan sebuah komponen TspeedButton, kemudian ubah property-nya seperti tabel berikut ini.

Nama Object

Nama Property

Nilai

TForm

AutoSize

True

BorderStyle

bsToolWindow

Name

FCrossHair

Position

poScreenCenter

TLabel (tab

Left

205

Standard).

   

Pasang pada

Name

LValues

komponen

Top

36

176

TChart

Transparent

True

TPanel (tab

BevelOuter

bvNone

Standard)

Color

clWhite

Height

40

Left

0

Name

Panel1

Top

407

Width

540

TCheckBox

Caption

&Cross Cursor

(tab Standard).

Checked

True

Pasang dalam

   

Panel1

Left

15

Name

CCross

Top

15

TSpeedButton

Caption

Cross-Hair Color

(tab

   

Additional).

Cursor

crHandPoint

Pasang dalam

Flat

True

Panel1

Height

22

Left

200

Name

BColor

Top

10

Width

135

Biarkan property yang lain sesuai nilai default-nya. Untuk mengedit property komponen TChart, klik ganda komponen tersebut sehingga muncul kotak dialog seperti Gambar 1.1. Buat

177

sebuah TChartSeries bertipe Line dua dimensi (tanda centang pada parameter 3D dihilangkan) dengan nama Series1 dan ubah nilai beberapa property lain sesuai kebutuhan.

Deklarasikan beberapa variabel pada bagian public unit dengan tipe data seperti berikut ini:

public { Public declarations } OldX, OldY: Longint; CrossHairColor: TColor; CrossHairStyle: TPenStyle; end;

Variabel OldX digunakan untuk menyimpan posisi horisontal (x) mouse sebelum digeser, sedangkan posisi vertikalnya (y) disimpan dalam variabel OldY. Nilai variabel CrossHairColor bertipe TColor digunakan untuk mengisi warna pena (property Color) yang akan dipakai saat melukis garis Cross-Hair pada komponen TChart. Property Style pena tersebut berasal dari nilai variabel CrossHairStyle.

Prosedur Event OnCreate pada TForm (FCrossHair)

Kode program yang dideklarasikan dalam prosedur event OnCreate hanya dijalankan sekali, yaitu saat form dibangun. Klik ganda sel di sebelah kanan event OnCreate form sehingga muncul sebuah prosedur pada jendela Code Editor.

procedure TFCrossHair.FormCreate(Sender: TObject); begin

Series1.FillSampleValues(30);

OldX:= -1; CrossHairColor:= clAqua; CrossHairStyle:= psSolid; CCrossClick(Sender); end;

Metode FillSampleValues akan memplot nilai acak pada TChartSeries dengan rentang data sebanyak angka dalam tanda kurung. Posisi horisontal mouse yang lama di-reset dengan memberi nilai -1 pada variabel OldX. Warna pertemuan kedua garis Cross-Hair ketika form FCrossHair pertama kali ditampilkan bernilai clAqua dan disimpan dalam variabel CrossHairColor. Garis Cross-Hair ditampilkan solid (tidak terputus-putus) dengan memberi nilai psSolid pada property Style pena (menjadi nilai

178

variabel CrossHairStyle). Prosedur CCrossClick untuk menjalankan perintah event OnClick komponen TCheckBox CCross.

Prosedur Event OnClick pada Komponen TCheckBox (CCross)

Komponen TCheckBox CCross berfungsi untuk mengubah kursor ketika mouse berada di daerah komponen TChart. Kursor

ditampilkan Cross (crCross) jika property Checked komponen

TCheckBox CCross bernilai True (dicentang) dan jika sebaliknya kursor berbentuk Default (crDefault). Klik ganda sel di sebelah kanan event OnClick komponen TCheckBox tersebut, kemudian deklarasikan perintahnya.

procedure TFCrossHair.CCrossClick(Sender: TObject); begin if CCross.Checked then Chart1.Cursor:= crCross else Chart1.Cursor:= crDefault; Chart1.OriginalCursor:= Chart1.Cursor; end;

Property OriginalCursor me-reset kursor komponen TChart ketika

mouse

dalamnya.

bergerak

melewati

TChartSeries

yang

terdapat

di

Prosedur Event OnMouseMove pada Komponen TChart (Chart1)

Prosedur event OnMouseMove berguna untuk menangani kejadian ketika mouse digerakan di atas komponen TChart Chart1. Buatlah prosedur lokal DrawCross pada prosedur event OnMouseMove yang berisi perintah-perintah untuk melukis garis Cross-Hair

dengan property Canvas komponen TChart.

procedure TFCrossHair.Chart1MouseMove(Sender: TObject; Shift:

TShiftState; X, Y: Integer);

procedure DrawCross(ax,ay: Integer); begin with Chart1, Canvas do begin Pen.Color:= CrossHairColor; Pen.Style:= CrossHairStyle;

Pen.Width:=1;

Pen.Mode:= pmXor; MoveTo(ax, ChartRect.Top-Height3D); LineTo(ax, ChartRect.Bottom-Height3D); MoveTo(ChartRect.Left+Width3D, ay); LineTo(ChartRect.Right+Width3D, ay);

179

end;

end;

var ValueX, ValueY: Double; begin if (OldX <> -1) then begin DrawCross(OldX, OldY); OldX:= -1; end;

if PtInRect(Chart1.ChartRect, Point(X-Chart1.Width3D, Y+Chart1.Height3D)) then begin DrawCross(x, y); OldX:= x; OldY:= y; with Series1 do begin GetCursorValues(ValueX, ValueY); LValue.Caption:= 'Nilai X/Y :

'+GetHorizAxis.LabelValue(ValueX)+

'/'+GetVertAxis.LabelValue(ValueY);

end; end else LValue.Caption:= ''; end;

Property Color TPen menentukan warna yang digunakan untuk menggambar garis dalam kanvas (komponen TChart Chart1).

Property Style TPen menentukan

style pena,

property Width

menentukan ketebalan garis tersebut, dan property Mode TPen menentukan bagaimana warna pena tersebut berinteraksi dengan warna kanvas. Tabel berikut ini menjelaskan arti nilai property

Style dan Mode.

Property

Nilai

Arti

Style

psSolid

Garis solid (tidak terputus-putus)

psDash

Garis disusun dari tanda minus (-)

psDot

Garis disusun dari tanda titik (.)

psDashDot

Garis disusun dari selang-seling tanda minus dan titik

psDashDotDot

Garis disusun dari kombinasi tanda minus-tanda titik-tanda titik

psClear

Tidak ada garis yang digambar

psInsideFrame

Garis solid, tetapi menggunakan banyak warna dan property Width lebih

180

   

dari 1

Mode

pmBlack

Selalu berwarna hitam

pmWhite

Selalu berwarna putih

pmNop

Tidak dapat diubah

pmNot

Kebalikan dari warna background kanvas

pmCopy

Warna pena ditentukan berdasarkan

property Color-nya

pmNotCopy

Kebalikan dari property Color TPen

pmMergePenNot

Kombinasi dari nilai property Color dan kebalikan warna background kanvas

pmMaskPenNot

Kombinasi warna dominan di antara nilai property Color dan kebalikan warna background kanvas

pmMergeNotPen

Kombinasi warna background kanvas

dan kebalikan nilai property Color TPen

pmMaskNotPen

Kombinasi warna dominan di antara warna background kanvas dan

kebalikan nilai property Color TPen

pmMerge

Kombinasi warna nilai property Color dan warna background kanvas

pmNotMerge

Kebalikan dari pmMerge

pmMask

Kombinasi warna dominan di antara

nilai property Color dan warna background kanvas

pmNotMask

Kebalikan dari pmMask

pmXor

Kombinasi warna nilai property Color atau warna background kanvas, tetapi bukan keduanya.

pmNotXor

Kebalikan dari pmXor

Kembali ke prosedur lokal DrawCross, metode Move To akan mengubah posisi mouse ke suatu koordinat. Pemanggilan metode

181

Move To sama dengan menentukan property PenPos TPen, serta dilakukan sebelum memanggil metode Line To. Metode Line To menggambar garis pada kanvas dari koordinat yang ditentukan dalam metode Move To sampai koordinat baru (x, y) yang ditentukan oleh mouse dan menetapkan posisi pena pada koordinat baru tersebut.

Pada prosedur lokal DrawCross, kombinasi metode MoveTo dan LineTo yang pertama untuk menggambar garis Cross-Hair vertikal dimulai dari koordinat (nilai variabel ax (posisi x Mouse), posisi atas kotak grafik (property ChartRect), tinggi dinding grafik akibat efek 3D (property Heigh3D)), sampai koordinat (nilai variabel ax, posisi bawah kotak grafik-tinggi dinding 3D). Pengurangan koordinat y dengan nilai property Height3D berguna untuk mengantisifasi tampilan grafik 3D (tiga dimensi), yaitu jika parameter CheckBox 3D pada subtab 3D (Gambar 1.10) diberi tanda centang. Property Height3D bernilai 0 jika grafik ditampilkan 2 dimensi sehingga garis Cross-Hair vertikal menempel pada dinding grafik.

Kombinasi yang kedua berguna untuk menggambar garis Cross- Hair horisontal dengan batas kiri garis pada koordinat (posisi kiri kotak grafik (property ChartRect) ditambah lebar dinding grafik akibat efek 3D (property Width3D), nilai variabel ay (posisi y Mouse)) dan batas kanan grafik pada koordinat (posisi kanan kotak grafik+lebar dinding 3D), nilai variabel ay). Property Width3D bernilai 0 jika grafik ditampilkan 2 dimensi. Nilai property

Height3D dan Width3D berdasarkan nilai SpinEdit 3D% pada

subtab 3D.

Pada prosedur event OnMouseMove di atas, jika posisi mouse tidak sedang di-reset (tidak sama dengan -1) maka prosedur lokal DrawCross dipanggil untuk membuat garis Cross-Hair. Nilai variabel ax dan ay berasal dari posisi (x, y) mouse sebelum posisi tersebut berubah menjadi yang tersimpan sementara dalam variabel OldX dan OldY. Posisi (x, y) mouse tersebut kemudian di- reset dengan memberi nilai -1 pada variabel OldX sehingga garis Cross-Hair yang telah terbentuk akan dihapus sebelum membuat

garis Cross-Hair baru.

182

Fungsi PtInRect mengecek posisi (x, y) mouse ketika berada di dalam kotak grafik Chart1 dengan syntax sebagai berikut:

function PtInRect(const Rect: TRect; const P: TPoint): Boolean;

Fungsi PtInRect akan bernilai True jika koordinat titik P berada di dalam kotak Rect. Jika posisi x mouse (dikurangi nilai property Height3D komponen TChart) dan posisi y mouse (ditambah nilai property Width3D komponen TChart) berada dalam kotak grafik

(property ChartRect komponen TChart) maka garis Cross-Hair

baru akan digambar berdasarkan posisi (x, y) mouse tersebut. Garis Cross-Hair lama telah terhapus dengan perintah sebelumnya. Selanjutnya, nilai posisi (x, y) mouse tersebut disimpan dalam variabel OldX (posisi x) dan OldY (posisi y).

Metode GetCursorValues berguna untuk mendapatkan nilai posisi (x, y) mouse pada TChartSeries yang ditentukan. Nilai-nilai tersebut disimpan sementara dalam variabel ValueX dan ValueY, kemudian ditampilkan dalam property Caption komponen TLabel LValue menggunakan metode LabelValue pada masing-masing sumbu grafik. Metode GetHorizAxis menghubungkan TChartSeries Series1 dengan sumbu horisontal grafik. Untuk menghubungkannya dengan sumbu vertikal grafik, gunakan

metode GetVertAxis.

Jika mouse tidak berada dalam kotak grafik (fungsi PtInRect bernilai False) maka garis Cross-Hair tidak digambar dan tidak ada teks yang ditampilkan dalam property Caption komponen TLabel LValue.

Prosedur Event OnAfterDrawValue pada TChartSeries (Series1)

Event OnAfterDrawValue terjadi setelah data diplot dalam TChartSeries, yaitu me-reset posisi (x, y) mouse. Perintah ini berguna ketika plot data dilakukan secara on-line. Cara membuatnya, aktifkan jendela Object TreeView, cari object bernama Series1 (terletak pada komponen TChart), kemudian aktifkan jendela Object Inspector dan klik ganda sel di sebelah

kanan event OnAfterDrawValue object tersebut.

procedure TFCrossHair.Series1AfterDrawValues(Sender: TObject); begin

183

OldX:= -1;

end;

Prosedur Event OnClick pada Komponen TSpeedButton (BColor)

Warna kursor Cross dapat diubah dengan mengubah nilai variabel CrossHairColor. Perubahan warna dapat dilakukan dengan memanggil kotak dialog Color dan dieksekusi dengan tombol OK. Oleh karena komponen TColorDialog tidak dipasang dalam form, deklarasikan function bernama EditColor pada bagian private unit dan ketikkan kode program untuk function tersebut untuk memanggil kotak dialog Color.

private { Private declarations } function EditColor(AOwner:TComponent; AColor:TColor):TColor;

function TFCrossHair.EditColor(AOwner: TComponent; AColor: TColor): TColor; begin with TColorDialog.Create(AOwner) do try Color:= AColor; if Execute then AColor:= Color; finally Free; end; result:= AColor; end;

Konstruktor Create pada komponen TColorDialog berguna untuk membangkitkan kotak dialog Color dan menginisialisasi warna yang terpilih berdasarkan nilai variabel AColor. Metode Execute digunakan untuk menampilkan kotak dialog Color. Jika kotak dialog Color tersebut dieksekusi, nilai variabel AColor akan sama dengan warna yang dipilih dari daftar warna pada kotak dialog Color. Hasil dari function EditColor adalah variabel AColor.

Komponen TSpeedButton BColor dipakai untuk menampilkan kotak dialog Color kemudian mengeksekusinya. Klik ganda sel di sebelah kanan event OnClick komponen tersebut.

procedure TFCrossHair.BColorClick(Sender: TObject); begin CrossHairColor:= EditColor(Self, CrossHairColor); end;

184

Warna yang terpilih ketika kotak dialog Color ditampilkan sama dengan nilai variabel CrossHairColor saat itu dan pada saat kotak dialog Color dieksekusi, hasilnya (nilai variabel AColor) menjadi nilai variabel CrossHairColor yang baru. Perubahan nilai variabel tersebut akan mengubah warna kursor Cross, sedangkan warna garis Cross-Hair merupakan kombinasi warna (dua warna yang sama) yang pertemuannya menghasilkan warna kursor Cross.

Untuk menampilkan form FcrossHair, buat sebuah prosedur event OnClick pada komponen TSpeedButton BShow yang terpasang dalam form FOtherDemo. Klik ganda komponen TSpeedButton tersebut kemudian ketik kode program berikut.

procedure TFOtherDemo.BShowClick(Sender: TObject); begin if GBExpand.Visible then begin if RCrossHair.Checked then FCrossHair.ShowModal; end; end;

Form FCrossHair hanya akan ditampilkan jika komponen TGroupBox GBExpand telah ditampilkan dan komponen TRadioButton RCrossHair dipilih, kemudian pengguna menekan komponen TSpeedButton BShow.

3.3 Zoom dan Scrolling Grafik dengan Tombol Keyboard

Pada aplikasi Sistem Akuisi Data, proses zoom grafik menggunakan komponen TSpeedButton dan scrolling grafik dengan komponen TScrollBar. Kedua proses tersebut dapat dilakukan dengan keyboard, untuk itu buat sebuah form baru, beri nama Fkeyboard, dan simpan unit dalam UKeyboard. Letakkan sebuah komponen TChart, sebuah komponen TPanel, 2 (dua) buah komponen TCheckBox, dan 2 (dua) buah komponen TLabel pada form FKeyboard. Ubah property komponen-komponen tersebut seperti tabel berikut ini. Untuk property yang mempunyai nilai lebih dari satu, nilai masing-masing dipisahkan oleh tanda titik koma. Sesuaikan berdasarkan urutan property Name.

185

 

Nama

 

Nama Object

Property

Nilai

TForm

AutoSize

True

BorderStyle

bsToolWindow

Caption

Zoom-Scrolling with Keyboard Topic

KeyPreview

True

Name

FKeyboard

Position

poScreenCenter

TPanel

BevelOuter

bvNone

(tab Standard)

Color

clWhite

Height

62

Left

0

Name

Panel1

Top

384

Width

540

TCheckBox

Caption

&Inverted Scrolling; Scrolling &Limited

(tab Standard)

sebanyak 2

   

buah. Pasang

Left

15

dalam Panel1

Name

CInverted; CLimit

Top

15; 40

Tlabel

AutoSize

True; False

186

(tab Standard)

Caption

Read This :; Gunakan tombol panah dan Page Up/Page Bottom untuk scrolling grafik. Tekan SPACE untuk me-reset zoom dan kombinasi tombol SHIFT + tombol panah untuk zoom grafik

sebanyak 2

buah pasang

dalam Panel1

Height

13; 40

Left

241; 247

Name

Label1; Label2

Top

1; 18

Transparent

True

Property yang lain biarkan sesuai dengan nilai default-nya. Pada komponen TChart, buat sebuah TChartSeries bertipe Line dua dimensi dengan nama Series1 dan ubah nilai beberapa property lain sesuai kebutuhan.

Untuk menampilkan form FKeyboard, buka kembali prosedur event OnClick BShowClick pada unit UOtherDemo (form FOtherDemo), kemudian tambahkan kode programnya sehingga prosedur tersebut menjadi seperti berikut ini.

procedure TFOtherDemo.BShowClick(Sender: TObject); begin if GBExpand.Visible then begin if RCrossHair.Checked then FCrossHair.ShowModal else if RKeyboard.Checked then FKeyboard.ShowModal; end; end;

Prosedur Event OnCreate pada TForm (FKeyboard)

Prosedur event OnCreate hanya berguna untuk menginisialisasi TChartSeries, yaitu nilai acak dengan rentang sebanyak 500 data yang diplot dalam TChartSeries melalui metode FillSampleValues. Klik ganda sel di sebelah kanan event OnCreate form, kemudian ketikkan kode programnya.

187

procedure TFKeyboard.FormCreate(Sender: TObject); begin

Series1.FillSampleValues(500);

end;

Prosedur Event OnShow pada TForm (FKeyboard)

Proses zoom dan scrolling grafik dengan keyboard hanya dapat dilakukan jika komponen TChart yang dimaksud menjadi focus form sehingga setiap kali form ditampilkan, komponen TChart Chart1 harus diset menjadi focus form seperti pada prosedur event OnShow berikut ini.

procedure TFKeyboard.FormShow(Sender: TObject); begin

Chart1.SetFocus;

end;

Prosedur event OnShow tersebut dapat diganti (dihapus) dengan

memberi

nilai

Chart1

pada

property

ActiveControl

form

FKeyboard.

Akan

tetapi

jika

aplikasi

mempunyai

komponen

TChart

yang

dapat

di-zoom

dan

scrolling

lebih

dari

satu,

pemberian

nilai

property

ActiveControl

tersebut

tidak

dapat

dilakukan.

Prosedur Event OnKeyDown pada TForm (FKeyboard)

Event OnKeyDown akan terjadi jika property KeyPreview form

bernilai True. Ketika pengguna menekan suatu atau kombinasi tombol keyboard dan form tersebut diaktifkan, perintah-perintah dalam event ini akan dijalankan. Klik ganda sel di sebelah kanan event OnKeyDown form Fkeyboard, kemudian ketikkan kode program berikut ini.

procedure TFKeyboard.FormKeyDown(Sender: TObject; var Key: Word; Shift: TShiftState);

var aX, aY, XRange,YRange:Double; begin aX:= 0; aY:= 0; with Series1.GetHorizAxis do XRange:= Maximum - Minimum; with Series1.GetVertAxis do YRange:= Maximum - Minimum;

if ssShift in Shift then begin Case key of VK_LEFT, VK_UP : Chart1.ZoomPercent(110);

188

VK_RIGHT, VK_DOWN : Chart1.ZoomPercent(90); end; exit; end else Case key of VK_LEFT : aX:= XRange/100; VK_RIGHT : aX:= -XRange/100;

VK_UP

VK_DOWN : aY:= YRange/100; VK_NEXT : aY:= YRange/10; VK_PRIOR : aY:= -YRange/10; VK_SPACE : begin Chart1.UndoZoom; Exit; end;

end;

: aY:= -YRange/100;

if CInverted.Checked then begin aX:= -aX; aY:= -aY; end;

with Chart1 do begin LeftAxis.Scroll(aY, CLimits.Checked); RightAxis.Scroll(aY, CLimits.Checked); BottomAxis.Scroll(aX, CLimits.Checked); TopAxis.Scroll(aX, CLimits.Checked); SetFocus; end; end;

Proses scrolling komponen TChart sebenarnya hanya menggeser range skala sumbu horisontal atau skala sumbu vertikal (nilai

property Maximum dikurangi dengan property Minimum). Nilai

skala maksimum dan minimum sumbu horisontal grafik diperoleh setelah dihubungkan dengan metode GetHorizAxis dan dengan metode GetVertAxis untuk sumbu vertikal. Range skala sumbu horisontal grafik disimpan dalam variabel XRange, sedangkan variabel YRange untuk menyimpan range skala sumbu vertikal grafik.

Flag ssShift merupakan salah satu nilai kelas bertipe TShiftState yang digunakan untuk menentukan keadaan tombol Alt, Ctrl, Shift, dan tombol mouse. Tabel berikut ini menjelaskan masing-masing arti nilai flag:

Nilai

Arti

ssShift

Tombol Shift ditekan

ssAlt

Tombol Alt ditekan

ssCtrl

Tombol Ctrl ditekan

189

ssLeft

Tombol kiri mouse ditekan

ssRight

Tombol kanan mouse ditekan

ssMiddle

Tombol tengah mouse ditekan

ssDouble

Mouse diklik ganda

Pada prosedur event KeyDown di atas, jika tombol Shift ditekan bersama dengan tombol panah kiri atau atas (VK_LEFT, VK_UP) maka grafik diperbesar 1,1 kalinya (110 %). Grafik diperkecil 90% jika kombinasi tombol Shift dan tombol panah kanan atau bawah (VK_RIGHT, VK_DOWN) ditekan pengguna. Penggunaan prosedur Exit adalah untuk mengeluarkannya dari prosedur yang sekarang sedang dijalankan.

Jika tombol Shift tidak ditekan, kemudian pengguna menekan salah satu tombol panah atau Page Up atau Page Down maka proses scrolling grafik akan dilakukan dengan metode Scroll pada masing-masing sumbu grafik. Metode Scroll mempunyai syntax:

procedure Scroll(Const Offset: Double; InsideLimits: Boolean);

Metode ini akan mengeser nilai skala maksimum dan minimum suatu sumbu grafik berdasarkan konstanta Offset. Jika ingin menggeser grafik secara tidak terbatas maka variabel InsideLimits harus bernilai False. Nilai variabel InsideLimits tergantung pada

nilai property Checked komponen TCheckBox CLimits.

Nilai variabel aX menentukan scrolling sumbu horisontal grafik, sedangkan variabel aY untuk scrolling sumbu vertikal grafik. Kedua variabel tersebut pertama kali diinisialisasi dengan nilai 0 untuk menghapus nilai sebelumnya. Jika penguna menekan salah satu tombol panah maka grafik akan digeser searah tanda panah tersebut sebesar nilai range sumbu grafik dibagi dengan 100. Pada sumbu horisontal, nilai range sumbu horisontal (variabel XRange) adalah 500 data (angka dalam tanda kurung metode FillSampleValues) sehingga jika pengguna menekan tombol panah kiri maka grafik akan digeser ke kiri sebesar 5 titik. Jika pengguna menekan tombol Page Up (VK_PRIOR) atau Page Down (VK_NEXT), grafik akan digeser secara vertikal sebesar nilai range

190

sumbu vertikal (variabel YRange) dibagi 10. Nilai range sumbu vertikal tergantung pada data random yang di-plot dalam

TChartSeries.

Untuk me-reset zoom grafik, digunakan tombol SPACE (VK_SPACE) dengan memanggil metode UndoZoom. Arah proses scrolling akan terbalik dengan arah tombol panah jika komponen TCheckBox CInverted dicentang, yaitu hanya dengan memberi nilai minus pada variabel aX dan aY.

Prosedur Event OnClick pada TCheckBox (CInverted dan CLimits)

Pemberian/penghilangan tanda centang pada komponen

TCheckBox akan membangkitkan event OnClick dan fokus form

berada pada komponen tersebut. Proses scrolling dan zoom grafik dengan tombol keyboard hanya akan terjadi jika komponen TChart yang dimaksud menjadi focus form sehingga prosedur event OnClick pada kedua komponen tersebut hanya berguna untuk mengembalikan focus form pada komponen TChart dengan memanggil metode SetFocus. Klik ganda masing-masing komponen TCheckBox sehingga pada jendela Code Editor akan muncul dua buah prosedur bernama CInvertedClick dan ClimitsClick. Ketikkan kode program berikut untuk masing-masing prosedur.

procedure TFKeyboard.CInvertedClick(Sender: TObject); begin

Chart1.SetFocus;

end;

procedure TFKeyboard.CLimitsClick(Sender: TObject); begin if CLimits.Checked then begin ShowMessage('Scrolling grafik terbatas hanya pada data '+ 'yang telah diplot.'+#13+ 'Lakukan zoom terlebih dahulu '+ 'sebelum scrolling grafik.');

Chart1.SetFocus;

end else

Chart1.SetFocus;

end;

Tambahan kode program pada prosedur ClimitsClick digunakan untuk menampilkan sebuah pesan ketika komponen TCheckBox Climits diberi tanda centang (property Checked bernilai True).

191

Pesan tersebut tidak

menghilangkan tanda centang pada komponen TCheckBox

Climits.

akan

muncul

ketika

pengguna

3.4 Mengubah Property BackImage Komponen TChart Secara Run-time

Property BackImage komponen TChart berguna untuk memberi latar belakang grafik dengan gambar. Saat desain form, gambar tersebut dicari dengan tombol Browse pada GroupBox BackImage subtab Panel (lihat kembali Gambar 1.7). Buat sebuah form dengan nama FBackImage dan simpan unit dalam UBackImage. Kemudian tambahkan sebuah komponen TOpenDialog, sebuah komponen TChart, sebuah komponen TPanel, sebuah komponen TGroupBox, 3 (tiga) buah komponen TRadioButton, dan 2 (dua) buah komponen TSpeedButton. Ubah property komponen- komponen tersebut seperti tabel berikut ini. Untuk property yang mempunyai nilai lebih dari satu, nilai masing-masing dipisahkan oleh tanda titik koma. Sesuaikan berdasarkan urutan property

Name.

 

Nama

 

Nama Object

Property

Nilai

TForm

AutoSize

True

BorderStyle

bsToolWindow

Caption

Property BackImage Topic

Name

FBackImage

Position

poScreenCenter

TPanel (tab

BevelOuter

bvNone

Standard)

Color

clWhite

Height

54

Left

0

Name

Panel1

192

 

Top

407

Width

540

TGroupBox

Caption

Style

(tab Standard).

   

Pasang pada

Color

clWhite

Panel1

Height

43

Left

8

Name

GBStyle

Top

7

Width

212

TRadioButton

Caption

Stretch; Tile; Center

(tab Standard)

Checked

True; False; False

sebanyak 3

buah. Pasang

Left

17; 81; 137

 

dalam GBStyle

 

Name

RStretch; RTile; RCenter

 

Top

20

TSpeedButton

Caption

Browse

;

Clear Bitmap

(tab Additional)

   

Cursor

crHandPoint

 

sebanyak 2

buah. Pasang

Flat

True

dalam Panel1

Height

22

Left

349; 447

Name

BBrowse; BClear

Top

20

Width

80

Biarkan Property yang lain sesuai nilai default-nya. Komponen TOpenDialog berfungsi untuk membuka folder tempat file gambar. Jika ingin menyaring file gambar dengan eketensi tertentu ketika kotak dialog Open ditampilkan, misalnya hanya file gambar

193

bertipe Bitmap (bmp), ubah property Filter-nya. Caranya, aktifkan jendela Object Inspector dan klik ganda sel di sebelah kanan property Filter sehingga muncul kotak dialog Filter Editor. Isikan sel pertama sebelah kiri dengan File Bitmap dan sel di sebelah kanannya dengan *.bmp, kemudian tekan tombol OK.

Untuk mengedit komponen TChart, klik ganda komponen tersebut sehingga muncul Gambar 1.1. Buat sebuah TChartSeries bertipe Line dua dimensi dengan nama Series1. Klik subtab Panel dan berikan gambar background Chart1 dengan menekan tombol

Browse

Pilih RadioButton Stretch pada GroupBox Style dan

tandai CheckBox Inside. Ubah nilai beberapa property lain sesuai kebutuhan.

Buka kembali prosedur BShowClick pada unit UotherDemo, kemudian tambahkan kode program untuk menampilkan form FBackImage melalui tombol BShow pada form FOtherDemo.

procedure TFOtherDemo.BShowClick(Sender: TObject); begin if GBExpand.Visible then begin if RCrossHair.Checked then FCrossHair.ShowModal else if RKeyboard.Checked then FKeyboard.ShowModal else FBackImage.ShowModal; end; end;

Prosedur Event OnCreate pada TForm (FBackImage)

Kode program pada event OnCreate form FBackImage hanya digunakan untuk menambahkan data pada TChartSeries Series1 sebanyak 100 data dengan memanggil metode FillSampleValues. Klik ganda sel di sebelah kanan event OnCreate, kemudian ketikkan perintahnya.

procedure TFBackImage.FormCreate(Sender: TObject); begin

Series1.FillSampleValues(100);

end;

194

Prosedur Event OnClick pada Komponen TSpeedButton (BBrowse dan BClear)

Komponen TSpeedButton BBrowse berfungsi untuk mencari gambar yang akan mengisi background komponen TChart Chart1, sedangkan komponen BClear berfungsi untuk menghapus gambar background tersebut. Klik ganda pada masing-masing komponen TSpeedButton tersebut sehingga pada jendela Code Editor muncul dua buah prosedur, kemudian ketikkan kode program berikut ini.

procedure TFBackImage.BClearClick(Sender: TObject); begin Chart1.BackImage:= nil; GBStyle.Enabled:= False; CInside.Enabled:= False; end;

procedure TFBackImage.BBrowseClick(Sender: TObject); begin if OpenDialog1.Execute then begin

Chart1.BackImage.LoadFromFile(OpenDialog1.FileName);

GBStyle.Enabled:= True; CInside.Enabled:= True; end; end;

Pada prosedur BClearClick, gambar background grafik dihapus dengan memberi nilai nil pada property BackImage komponen TChart Chart1.

Sebuah kotak dialog Open akan muncul ketika pengguna menekan komponen BBrowse, kemudian jika kotak dialog tersebut dieksekusi (tombol Open ditekan) maka dengan metode LoadFromFile, background grafik akan diisi dengan file gambar yang telah dipilih. Property Enabled komponen TGroupBox GBStyle dan komponen TCheckBox CInside diberi nilai True sehingga dapat diakses kembali setelah pada prosedur BClearClick dinonaktifkan.

Prosedur Event OnClick pada Komponen TRadioButton (RStretch, RTile, dan RCenter)

Style gambar dapat diset dalam mode Stretch, Tile, dan Center. Mode Stretch menyebabkan gambar mengambil ukuran dan bentuk komponen TChart, artinya jika ukuran dan bentuk komponen TChart diubah maka gambar akan ikut berubah.

195

Seluruh gambar background akan ditampilkan seukuran komponen TChart meskipun ukuran gambar tersebut terlalu besar. Dalam mode Tile, jika gambar background terlalu besar maka gambar tersebut tidak seluruhnya mengisi komponen TChart, tetapi ditampilkan apa adanya dimulai dari posisi kiri atas gambar kemudian terpotong sampai pada batas bawah dan kanan grafik. Pada mode Center, hanya posisi tengah gambar yang akan memenuhi background grafik jika ukuran gambar tersebut terlalu besar. Blok ketiga komponen tersebut, isi sel di sebelah kanan event OnClick dengan nama prosedur RadioButtonClick, kemudian tekan tombol Enter.

procedure TFBackImage.RadioButtonClick(Sender: TObject); begin if RStretch.Checked then Chart1.BackImageMode := pbmStretch else if RTile.Checked then Chart1.BackImageMode := pbmTile else Chart1.BackImageMode := pbmCenter; end;

Jika pengguna memilih komponen TRadioButton RStretch maka gambar background grafik ada dalam mode Stretch, demikian seterusnya untuk komponen TRadioButton yang lain.

Prosedur Event OnClick pada Komponen TCheckBox (CInside)

Gambar background grafik dapat dibuat memenuhi seluruh dinding komponen TChart atau hanya dalam kotak grafiknya saja, bergantung pada nilai property BackImageInside-nya. Untuk mengendalikan nilai property tersebut, gunakan nilai property Checked komponen TCheckBox CInside. Klik ganda komponen TCheckBox tersebut kemudian ketik kode programnya.

procedure TFBackImage.CInsideClick(Sender: TObject); begin Chart1.BackImageInside:= CInside.Checked; end;

Property BackImageInside komponen TChart akan bernilai True

jika komponen TCheckBox CInside diberi tanda centang.

196

3.5 Digital Series

Seluruh sistem operasi dalam komputer sebenarnya menggunakan kombinasi bilangan biner, yaitu 0 (nol) dan 1 (satu). Proses tersebut kemudian dinamakan proses digital. Buat sebuah form baru bernama FDigital dan simpan unitnya dengan nama UDigital. Pada form tersebut, letakkan sebuah komponen TChart, sebuah komponen TPanel, sebuah komponen TTimer, sebuah komponen TspeedButton, dan 3 (tiga) buah komponen TCheckBox. Ubah property komponen-komponen tersebut seperti tabel berikut ini.

Nama Object

Nama Property

Nilai

TForm

AutoSize

True

BorderStyle

bsToolWindow

Caption

Digital Series Topic

Name

FDigital

Position

poScreenCenter

TPanel (tab

BevelOuter

bvNone

Standard)

Color

clWhite

Height

72

Left

0

Name

Panel1

Top

407

Width

540

TTimer (tab

Enabled

False

System)

Interval

1

 

Name

Timer1

TSpeedButton

Caption

&Run

197

(tab

Cursor

crHandPoint

Additional).

   

Pasang dalam

Flat

True

Panel1

Height

54

Left

424

Name

BRun

Top

10

Width

102

TCheckBox

Caption

Last Values in Legend; View 3D; Z Order

(tab Standard)

sebanyak 3

   

buah. Pasang

Cheked

True

dalam Panel

Left

15

Name

CLastValues; CView; COrder

Top

10; 30; 50

Biarkan nilai property yang lain sesuai default-nya. Pada komponen Tchart, buat empat buah TChartSeries bertipe line tiga dimensi, kemudian beri judul yang berbeda sebagai nama masing- masing TChartSeries, dengan menekan tombol Title pada subtab Series (Gambar 1.1). Klik tab Series, kemudian pilih subtab Format seperti Gambar 2.3. Pada GroupBox Line Mode, beri tanda

centang pada CheckBox Stairs untuk mengubah TChartSeries

dalam bentuk seperti „tangga‰ (umumnya grafik digital). Ubah property komponen TChart yang lain sesuai kebutuhan.

Untuk memanggil form FDigital, tambahkan beberapa kode pada

prosedur

event

OnClick

komponen

TSpeedButton

BShow

(BShowClick). Prosedur tersebut sekarang menjadi seperti berikut:

procedure TFOtherDemo.BShowClick(Sender: TObject); begin if GBExpand.Visible then begin if RCrossHair.Checked then FCrossHair.ShowModal else if RKeyboard.Checked then FKeyboard.ShowModal else FBackImage.ShowModal end else begin

198

if RDigital.Checked then FDigital.ShowModal; end; end;

Prosedur Event OnCreate pada TForm (FDigital)

Prosedur event OnCreate form hanya berisi inisialisasi beberapa property. Klik ganda sel di sebelah kanan event OnCreate form, kemudian ketikkan kode program berikut pada prosedur yang muncul.

procedure TFDigital.FormCreate(Sender: TObject); begin Chart1.ApplyZOrder:= COrder.Checked; Chart1.Legend.Inverted:= True; end;

Property ApplyZOrder digunakan untuk mengontrol ketika beberapa TChartSeries pada komponen TChart yang sama harus ditampilkan independen dalam ruang Z yang berbeda. Property tersebut valid jika grafik ditampilkan 3D dan mempunyai lebih dari

satu TChartSeries. Pemberian nilai True pada property Inverted

subtab Legend untuk membalikkan urutan legend grafik dari TChartSeries berindeks terbesar.

Prosedur Event OnTimer pada Komponen TTimer (Timer1)

Untuk simulasi operasi, data sinyal digital berupa data acak dengan range 2 data (0 dan 1) diplot pada keempat TChartSeries dengan menggunakan komponen TTimer Timer1. Klik ganda komponen tersebut sehingga pada jendela Code Editor muncul sebuah prosedur.

procedure TFDigital.Timer1Timer(Sender: TObject); var GainData: Longint; begin for GainData:= 0 to Chart1.SeriesCount-1 do with Chart1.Series[GainData] do Add(2*GainData+Random(2), '', clTeeColor);

with Chart1.BottomAxis do begin Automatic := False; Maximum := Series1.XValues.Last; Minimum := Maximum - 100; end; end;

199

Variabel GainData berguna untuk menaikkan TChartSeries pada suatu posisi sehingga keempat TChartSeries tersebut tidak saling tumpang tindih. Plot data pada masing-masing TChartSeries menggunakan metode Add dengan syntax:

function Add(Const AValue:Double; Const ALabel:String; AColor:TColor):Longint; virtual;

Metode Add digunakan untuk menambahkan data pada TChartSeries jika nilai sumbu horisontal grafik (x) secara otomatis ditentukan ketika nilai sumbu vertikal (y) akan diplot. Varibel ALabel dan AColor merupakan parameter pilihan seperti pada metode AddXY. Nilai Y grafik untuk TChartSeries kedua bergeser secara vertikal sebanyak 2 (dua) kalinya, sedangkan yang ketiga bergeser 4 (empat) kalinya dan yang keempat bergeser sebanyak 6 (enam) kalinya.

Kode program selanjutnya adalah untuk menggeser grafik ke kiri setiap kali ada data yang diplot dalam TChartSeries. Nilai skala maksimum sumbu bawah grafik mengambil nilai terakhir yang telah diplot dalam TChartSeries. Range sumbu horisontal grafik yang ingin ditampilkan setiap kali ada plot data adalah 100 data. Kode program ini dapat ditulis dalam event OnAfterAdd pada keempat TChartSeries seperti pada pembuatan aplikasi Sistem Akuisisi Data.

Prosedur Event OnClick pada Komponen TSpeedButton (BRun)

Pada saat desain form, property Enabled komponen TTimer

Timer1 bernilai False sehingga untuk mengendalikannya dimanfaatkanlah komponen TSpeedButton BRun. Klik ganda sel di sebelah kanan event OnClick komponen tersebut, kemudian ketik kode programnya.

procedure TFDigital.BRunClick(Sender: TObject); begin if BRun.Caption = '&Run' then begin BRun.Caption:= 'Stop'; Timer1.Enabled:= True; end else begin BRun.Caption:= '&Run'; Timer1.Enabled:= False; end end;

200

Selain untuk mengaktifkan komponen TTimer Timer1, komponen

untuk menonaktifkann

TSpeedButton

BRun

juga

digunakan

berdasarkan

nilai

property

Caption

komponen

TSpeedButton

tersebut.

Prosedur

Event

OnClick

pada

Komponen

TCheckBox

(CLastValues, CView, dan COrder)

Ketiga komponen TCheckBox tersebut berfungsi untuk mengubah

beberapa property komponen TChart, yaitu property LegendStyle pada subtab Legend, property 3D pada subtab 3D, dan property

ApplyZOrder. Klik ganda masing-masing komponen TCheckBox, sehingga muncul tiga buah prosedur. Lengkapi ketiga prosedur tersebut sehingga menjadi seperti berikut ini

procedure TFDigital.CLastValuesClick(Sender: TObject); begin if CLastValues.Checked then Chart1.Legend.LegendStyle:= lsLastValues else Chart1.Legend.LegendStyle:= lsAuto; end;

procedure TFDigital.CViewClick(Sender: TObject); begin Chart1.View3D:= CView.Checked; end;

procedure TFDigital.COrderClick(Sender: TObject); begin Chart1.ApplyZOrder:= COrder.Checked;

Chart1.Repaint;

end;

Property LegendStyle berguna untuk menentukan materi mana yang akan ditampilkan dalam legend grafik. Jika diberi nilai Last Values maka akan ditampilkan nilai terakhir dari semua TChartSeries yang aktif. Jika diberi nilai Automatic maka secara otomatis nilai property Title TChartSeries akan ditampilkan dalam legend grafik. Metode Repaint menyebabkan Chart induk di-repaint (digambar ulang).

201

Prosedur

Event

OnGetLegendTex

pada

Komponen

TChart

(Chart1)

Event OnGetLegendText digunakan untuk mengganti penulisan teks pada legend grafik. Klik ganda sel di sebelah kanan event OnGetLegendText komponen TChart Chart1, kemudian ketikkan kodenya.

procedure TFDigital.Chart1GetLegendText(Sender:

TCustomAxisPanel; LegendStyle: TLegendStyle; Index:

Integer; var LegendText: String); begin if LegendStyle = lsLastValues then LegendText:= LegendText+' --> '+Chart1.Series[Index].Title; end;

Teks legend akan diganti jika komponen TCheckBox CLastValues diberi tanda centang (atau property LegendStyle komponen

TChart bernilai lsLastValues).

3.6 Mengukur Kecepatan Plot Data pada TChartSeries Bertipe Fast Line

Plot data pada TChartSeries bertipe Fast Line lebih cepat dibandingkan dengan tipe Line. Untuk mnegukur kecepatannya, buat sebuah form baru dan simpan dalam unit UFastLine. Selanjutnya, pasang sebuah komponen TChart, sebuah komponen TPanel, sebuah komponen TSpeedButton, dan 3 (tiga) buah komponen TCheckBox. Ubah property komponen-komponen tersebut seperti tabel berikut ini.

 

Nama

 

Nama Object

Property

Nilai

TForm

AutoSize

True

BorderStyle

bsToolWindow

Caption

Fast Line Series Topic

Name

FFastLine

Position

poScreenCenter

202

TPanel (tab

BevelOuter

bvNone

Standard)

Color

clWhite

Height

40

Left

0

Name

Panel1

Top

407

Width

540

TSpeedButton

Caption

Speed Test

(tab

   

Additional).

Cursor

crHandPoint

Pasang dalam

Flat

True

Panel1

Height

22

Left

392

Name

BSpeed

Top

10

Width

134

TCheckBox

Caption

&Buffered Display; Draw &Axis; &Clip Points

(tab Standard)

sebanyak 3

   

buah. Pasang

Left

15; 150; 250

dalam Panel

Name

CBuffered; CDraw; CClip

Top

15

Biarkan nilai property yang lain sesuai default-nya. Klik ganda komponen TChart untuk mengedit property-nya. Klik tab Chart dan pilih subtab Series, lalu buat dua buah TChartSeries bertipe Fast Line dua dimensi dengan menekan tombol Add Selanjutnya, pilih subtab General, hilangkan tanda centang pada CheckBox Clip Points. Pada subtab Axis, hilangkan tanda centang pada CheckBox Show Axis sehingga sumbu grafik tidak

203

ditampilkan. Property yang lain dapat diubah sesuai kebutuhan Anda.

Form FFastLine ditampilkan melalui form FOtherDemo dengan menekan komponen TSpeedButton BShow di mana komponen TGroupBox GBFeatures telah ditampilkan dan komponen TRadioButton RFastLine dipilih. Buka kembali prosedur BShowClick pada unit UOtherDemo untuk menambahkan beberapa kode seperti berikut ini.

procedure TFOtherDemo.BShowClick(Sender: TObject); begin if GBExpand.Visible then begin if RCrossHair.Checked then FCrossHair.ShowModal else if RKeyboard.Checked then FKeyboard.ShowModal else FBackImage.ShowModal end else begin if RDigital.Checked then FDigital.ShowModal; if RFastLine.Checked then FFastLine.ShowModal; end; end;

Prosedur Event OnCreate pada TForm (FFastLine)

Inisialiasasi beberapa variabel, plot data random dalam TChartSeries dilakukan ketika form dibangun melalui prosedur event OnCreate. Klik ganda sel di sebelah event tersebut, kemudian ketik perintah-perintahnya.

procedure TFFastLine.FormCreate(Sender: TObject); var DataX, DataRandom: Longint; begin TeeEraseBack:= False; Chart1.BufferedDisplay:= False; TeeDefaultCapacity:= 2000;

for DataX:= 1 to 1000 do begin DataRandom:= Random(Abs(500-DataX))-(Abs(500-DataX) div 2); Series1.Add(DataX+DataRandom, '', clTeeColor); Series2.Add(1000-DataX+DataRandom, '', clTeeColor); end; end;

Variabel global TeeEraseBack berfungsi untuk menangani pesan (message) WM_ERASEBACK. Jika bernilai False, akan mencegah

204

TeeChart menghapus latar belakang panel ketika ada perubahan

ukuran grafik. Property BufferedDisplay secara default bernilai

True untuk mencegah kelap-kelip ketika grafik yang mempunyai banyak titik diplot kembali sehingga kedipan tersebut hanya terjadi pada daerah kotak grafik. Variabel global TeeDefaultCapacity merupakan kapasitas default untuk object Tlist. Komponen TChart selalu menggunakan variabel ini untuk menginisialisasi kapasitas TList. Secara default, ia bernilai 0 dan jika diset lebih besar lagi dapat meningkatkan kecepatan ketika memplot data pada

TChartSeries.

Data yang akan diplot pada masing-masing TChartSeries adalah sebanyak 1000 data. Agar data random yang diplot tersebut terlihat menyempit ke tengah dan melebar ke kedua sisinya, buat suatu fungsi pada variabel DataRandom. Penambahan variabel DataRandom dengan nilai DataX dalam fungsi Add pada TChartSeries Series1 menyebabkan TChartSeries