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 suatu grafik. Buatlah sebuah form baru dan pada form tersebut, pasang sebuah komponen TChart, komponen TLabel, komponent TPanel, komponen TCheckBox dan ubah propertinya sebagai berikut :
Langkah Pertama :
Klik ganda komponen TChart dan buat sebuah TChartSeries bertipe Line dua dimensi (Tanda centang pada parameter 3D dihilangkan). Deklarasikan beberapa variabel pada bagian public dengan tipe data seperti berikut :
Public
OldX, OldY : LongInt;
CrossHairColor: Tcolor;
CrossHairStyle: TPenStyle;
end;
Variable OldX digunakan untuk menyimpan posisi horisontal (x) mouse sebelum digeser, sedangkan posisi vertikalnya (Y) disimpan dalam variabel OldY. Nilai variabel CrossHairColor bertype 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.
Procedure Even OnCreate pada TForm1 (TForm1)
Kode program yang dideklarasikan dalam procedure even OnCreate hanya dijalankan sekali, yaitu saat form dibangun. Klik ganda sel di sebelah kanan even OnCreate form sehingga muncul sebuah procedure pada jendela code editor.
Procedure TForm1.FormCreate(sender: TObject);
Begin
series1.FillSampleValues(30); // akan memberikan nilai acak pada TChartSeries dengan rentang data sebanyak dalam kurung
OldX := -1 ;
CrossHairColor := clAqua;
CrossHairStyle := psSolid;
CCrossClick(sender);
end;
Posisi horizontal yang lama di-reset dengan memberi nilai -1 pada variabel OldX. Warna pertemuan kedua garis Cross-Hair ketika form1 pertamakali ditampilkan bernilai clAqua dan disimpan dalam variabel CrossHairColor. Garis cross-Hair ditampilkan solid (tidak terputus-putus) dengan memberi nilai psSolid pada properti style pena (menjadi nilai variabel CrossHairStyle). Procedure CrossClick untuk menjalankan perintah event OnClick komponen TCeckBox1.
Procedure EvenOnClick pada komponen TCeckBox1
Komponen TCheckBox berfungsi untuk mengubah kursor ketika mouse berada di daerah komponen TChart. Kursor ditampilkan apabila property Checked komponen TCheckBox bernilai true dan jika sebaliknya kursor berbentuk default. Ketikkan code program berikut pada komponen TChekBox :
procedure TForm1.CheckBox1Click(Sender: TObject);
begin
if CheckBox1.Checked then Chart1.Cursor := crCross else
chart1.cursor := crDefault;;
chart1.OriginalCursor := chart1.Cursor;
end;
Properti OriginalCursor me-reset kursor komponen Tchart ketika mouse bergerak melewati TChartSeries yang ada di dalamnya.
Procedure Event OnMouseMove pada komponent TChart (Chart1)
Procedure Event OnMouseMove berguna untuk menangani kejadian ketika mouse digerakkan di atas komponent TChart. Buatlah procedure local DrawCross pada procedure event OnMouseMove yang berisi perintah-perintah untuk melukis garis Cross-Hair dengan properti canvas komponent TChart. Klik TChart dan pada properti event double klik pada OnMouseMove dan ketikkan code sebagai berikut :
procedure TForm1.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);
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);
label1.Caption:='Koordinat sumbu X/Y = '+ gethorizaxis.LabelValue(ValueX) + '/'+getvertaxis.LabelValue(ValueY);
end;
end else
label1.Caption:='';
end;
Procedure Event OnAfterValue pada Tchart series (series 1)
Event OnAfterValue terjadi setelah data diplot dalam TChartSeries, yaitu mereset posisi (x,y) mouse. Perintah ini berguna ketika plot data dilakukan secara on-lin
procedure TForm1.Chart1AfterDraw(Sender: TObject);
begin
oldX:=-1;
end;
Masalah yang terjadi adalah terjadinya error dimana CCrossClick(sender); tidak dikenali maka kita dapat menonaktifkannya. Ketika checkbox dicentang, maka tampilan kursor pada grafik akan seperti pada gambar di atas. Apabila checkbox tidak dicentang akan menampilkan kursor dengan defaul tanda panah.
