Mungkin di antara kamu ada yang suka menambahkan gambar sebagai latar belakang grafik sehingga tampilan grafik akan lebih menarik.
Artikel ini masih merupakan bagian dari project TChart, buka kembali project sebelumnya, atau kalau nggak ada download TChart Source Code ver.1.5, kemudian ekstrak di komputer kamu, jangan lupa untuk membuat driver ODBC database linked (atau baca kembali artikel Menampilkan Database dalam Grafik). Selanjutnya download Back Image Source Code, kemudian ekstrak dan seperti biasa tambahkan pada project TChart tersebut dengan meng-klik kanan mouse pada project TChart.exe. Pada menu yang muncul klik Add.. kemudian cari file .pas yang ingin ditambahkan seperti gambar di bawah ini
Agar bisa dipanggil melalui aplikasi TChart, aktifkan form fmMainTChart, kemudian klik ganda komponen popupmenu bernama pmOtherDemo.. pada popmenu yang muncul klik ganda menu Background Image..
Kemudian tambahkan code berikut
procedure TfmMainTChart.miBackImageClick(Sender: TObject); begin fmBackImage.ShowModal; end;
Tekan tombol Run untuk menjalankan aplikasi ini… jika muncul pesan Form ‘fmMainTChart ‘ references form ‘fmBackImage’ declarated in unit ‘uBackImage’ which is not in your USES list. Do you wish to add it? tekan tombol Yes kemudian Tekan kembali tombol Run..
1. Inisialisasi aplikasi
Inisialisasi aplikasi untuk menentukan nilai awal dikodekan dalam event OnCreate form, klik ganda sel di sebelah kanan event OnCreate dari form fmBackImage..
procedure TfmBackImage.FormCreate(Sender: TObject); begin Series1.FillSampleValues(100); end;
Kode program di atas hanya untuk menambahkan data pada Series1 sebanyak 100 data dengan memanggil metode FillSampleValues.
2. Menentukan tampilan background grafik
Style background grafik dapat di-set 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. Dan seluruh gambar background akan ditampilkan seukuran komponen TChart meskipun ukuran gambar tersebut terlalu besar. Sedang 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. Klik ganda pada salah satu dari ketiga komponen radiobutton (prosedure untuk ketiga komponen ini dijadikan satu, prosedur RadioButtonClick)
procedure TfmBackImage.RadioButtonClick(Sender: TObject);
begin
if rbStretch.Checked then
ctBackImage.BackImageMode := pbmStretch
else
if rbTile.Checked then
ctBackImage.BackImageMode := pbmTile
else
ctBackImage.BackImageMode := pbmCenter;
end;
Gambar background grafik juga dapat dibuat memenuhi seluruh ‘dinding’ grafik atau hanya dalam kotak grafiknya saja tergantung pada nilai property BackImageInside-nya. Untuk mengendalikan nilai property tersebut gunakan komponen checkbox chInside, klik ganda komponen tersebut..
procedure TfmBackImage.chInsideClick(Sender: TObject); begin ctBackImage.BackImageInside:= chInside.Checked; end;
Artinya jika checkbox chInside di’centang’ maka background grafik hanya berada dalam kotak grafik.
3. Mengubah background grafik
Komponen TOpenDialog yang terpasang berfungsi untuk membuka folder tempat file gambar. Jika ingin menyaring file gambar dengan eketensi tertentu ketika kotak dialog Open ditampilkan, misalnya hanya file gambar bertipe Bitmap (bmp), ubah property Filter-nya. Caranya aktifkan jendela Object Inspector, klik ganda sel di sebelah kanan property Filter sehingga muncul kotak dialog Filter Editor. Isikan misalnya sel pertama sebelah kiri dengan File Bitmap dan sel di sebelah kanannya dengan *.bmp, kemudian tekan tombol Ok. Lebih jelasnya perhatikan gambar di bawah ini
Untuk memanggil kotak dialog Open, gunakan komponen button btBrowse, klik ganda komponen ini..
procedure TfmBackImage.btBrowseClick(Sender: TObject);
begin
if OpenDialog1.Execute then
begin
ctBackImage.BackImage.LoadFromFile(OpenDialog1.FileName);
gbStyle.Enabled:= True;
chInside.Enabled:= True;
end;
end;
Sebuah kotak dialog Open akan muncul ketika pengguna menekan tombol Browse.., kemudian jika kotak dialog tersebut dieksekusi (menekan tombol Open) maka dengan metode LoadFromFile, background grafik akan diisi dengan file gambar yang telah dipilih. Property Enabled komponen groupbox gbStyle dan komponen checkbox chInside diberi nilai True sehingga dapat diakses kembali setelah sebelumnya pada prosedur btClearClick dinon-aktifkan.
Sedang komponen button yang tersisa, btClear, untuk membersihkan background grafik. Klik ganda komponen tersebut..
procedure TfmBackImage.btClearClick(Sender: TObject); begin ctBackImage.BackImage:= nil; gbStyle.Enabled:= False; chInside.Enabled:= False; end;
Pada prosedur BClearClick di atas, gambar background grafik dihapus dengan memberi nilai nil pada property BackImage komponen TChart.
Nuwun..
Daftar download untuk artikel ini:
1. TChart Source Code ver.1.5 - 35.14 kB
2. Back Image Source Code - 143.17 kB
3. TChart Application ver.1.5 - 819.96 kB
