Delphi: Komponen Chart

Komponen Chart

Sesi kali ini akan membahas bagaimana penggunaan komponent chart pada Delphi.

Chart adalah komponen pada Borland Delphi 7 yang dipergunakan untuk menampilkan
data-data dalam bentuk angka ke dalam bentuk grafik sehingga mudah untuk difahami. Pada dasarnya Delphi menyediakan 10 buah grafik standard yang dapat dipergunakan: tampilannya.

Jenis-Jenis Chart

Jenis-Jenis Chart

Jenis-jenisnya adalah sebagai berikut :

 Line Bar
 Bar
 Horizontal Bar
 Area
 Point
 Pie
 Fast line
 Shape
 Gantt
 Arrow
 Bubble

Struktur Komponen Chart

Chart merupakan grafik induk (ParentChart) untuk semua komponen Series. Sedangkan semua tipe series diturunkan dari kelas abstrak TChartSeries. Kemudian dari TChartSeries inilah sebuah method untuk menggambar grafik bisa dipanggil. Method yang lazim digunakan adalah AddXY, dengan struktur sebagai berikut :

Function AddXY(Const AXValue, AYValue: Double; Const AXLabel: String; Acolor: TColor) : LongInt;
Dimana :

  • AXValue adalah nilai sumbu x,
  • AYValue adalah nilai sumbu y,
  • AXLabel adalah teks yang muncul pada sumbu x,
  • Acolor adalah warna garis grafik.

Catatan : Jika ingin pada sumbu x muncul nilai yang sesuai, maka kosongkan nilai parameter AXLabel dengan mengisi string kosong (‘’).
Apabila nilai pada parameter Acolor tidak diisi, maka garis grafiknya akan mengambil warna pada saat desain.

Latihan 1

Untuk memudahkan pemahaman akan diberikan Latihan  pemaanfaatan chart. Akan dibuat program yang menyajikan grafik penerimaan mahasiswa baru berdasarkan data inputan yang terdiri dari empat tahun: 2008, 2009, 2010 dan 2011. Contoh keluaran dapat dilihat pada gambar dibawah ini.

Contoh Latihan Penggunaan Chart dalam Delphi

Contoh Latihan Penggunaan Chart dalam Delphi

Desain Form

Desainlah form dengan meletakkan komponen-komponensebagai berikut:

Letakkan 4 Control label, 4 komponen EditBox, 3 komponen Bitbutton (terletak pada tab Additional), control  Chart.

Control Chart terletak pada tab Additional, seperti tersaji pada gambar berikut ini

letak control chart

letak control chart

Chart Delphi - Desain Form

Chart Delphi – Desain Form

Pengaturan Properti

Obyek/Control Properti Nilai
Form Caption Grafik Penerimaan Mahasiswa Baru
Label1 Caption 2008
Caption 2009
Caption 2010
Caption 2011
BitBtn1 Kind bkOK
BitBtn2 Kind bkCancel
BitBtn2 Kind bkClose

untuk pengaturan properti pada Chart, ikuti langkah berikut:

  • klik kanan control chart.
  • Klik tab Series
  • Klik tombol Add
  • Klik tipe Bar chart
  • Klik Ok
Chart Delphi - Pengaturan properti pada control chart

Chart Delphi – Pengaturan properti pada control chart

Pengkodean

procedure TForm1.FormCreate(Sender: TObject);
begin
  Chart1.Title.Text.Clear;
  chart1.Title.Text.Add('Grafik Penerimaan Mahasiswa Baru')
end;

procedure TForm1.BitBtn1Click(Sender: TObject);
begin
  Chart1.Series[0].clear;
  Chart1.Series[0].Add(strtofloat(Edit1.Text),'2008',clred);
  Chart1.Series[0].Add(strtofloat(Edit2.Text),'2009',clyellow);
  Chart1.Series[0].Add(strtofloat(Edit3.Text),'2010',clmaroon);
  Chart1.Series[0].Add(strtofloat(Edit4.Text),'2011',cllime);
end;

procedure TForm1.BitBtn2Click(Sender: TObject);
begin
     Chart1.Series[0].clear;
     Edit1.Text :='';
     Edit2.Text :='';
     Edit3.Text :='';
     Edit4.Text :='';
end;

procedure TForm1.BitBtn3Click(Sender: TObject);
begin
   Close;
end;

Latihan 2

Buatlah Program menyajikan jumlah mahasiswa aktif masing-masing fakultas disajikan dalam bentuk tabulasi (grid) dan grafik (chart).

Desain Form

Grid dan Chart Delphi - Desain Form

Grid dan Chart Delphi – Desain Form

Pengkodean

procedure TForm1.FormCreate(Sender: TObject);
begin
   StringGrid1.Cells[0,0]:='Fakultas';
   StringGrid1.Cells[0,1]:='Teknik';
   StringGrid1.Cells[0,2]:='Ekonomi';
   StringGrid1.Cells[0,3]:='Pertanian';
   StringGrid1.Cells[0,4]:='KIP';
   StringGrid1.Cells[1,0]:='Jumlah';

end;

procedure TForm1.Button1Click(Sender: TObject);
begin
   stringgrid1.Cells[1,combobox1.ItemIndex+1]:=Edit1.Text;
end;

procedure TForm1.BitBtn1Click(Sender: TObject);
   var i: integer;
begin
   for i:=1 to stringgrid1.rowcount-1 do
   chart1.Series[0].Add(strtofloat(stringgrid1.cells[1,i]),stringgrid1.cells[0,i]);
end;

Hasil Eksekusi

Grid dan Chart Delphi - Hasil Eksekusi

Grid dan Chart Delphi – Hasil Eksekusi

Latihan 3

Buatlah program untuk menginputkan data X sebanyak 10 data, pada saat pengguna menginputkan data X maka program mengihitung nilai X2 dan memasukkannya kedalam Grid.
•    Ketika pengguna mengklik tombol Rekap, maka program menampilkan Jumlah dan rata-rata dari data-data X dan data X2 .
•    Ketika pengguna mengklik tombol Grafik X, maka program menampilkan Grafik untuk Data X
•    Ketika pengguna mengklik tombol Grafik X^2, maka program menampilkan Grafik untuk Data X2
•    Ketika pengguna mengklik tombol Reset, maka seluruh isi data pada grid, hasil rekapitulasi  dan chart dikosongkan kemabali.
Ketika pengguna mengklik tombol Tutup, maka program ditutup

Desain Form - String Grid dan Chart

Desain Form – String Grid dan Chart

Pengaturan Properti

Pengaturan Form StringGrid dan Chart

Pengaturan Form StringGrid dan Chart

untuk pengaturan properti pada Chart, ikuti langkah berikut:

  • klik kanan control chart.
  • Klik tab Series
  • Klik tombol Add
  • Klik tipe Bar chart
  • Klik Ok

Chart Delphi - Pengaturan properti pada control chart

Tuliskan komentar anda

Komentar

Tinggalkan Balasan