Komputer Grafis 6

Kembali pada pembahasan Komputer Grafis. Pada pertemuan ini masih dibahas seputar transformasi geometri. Jika pada pertemuan-pertemuan yang lalu dibahas mengenai translasi, scaling, dan rotasi, maka pada pertemuan ini akan dibahas mengenai tranasformasi geometri komposit. Apa yang dimaksud dengan komposit?

Jika sebelumnya kita melakukan scaling di luar titik (0,0) maka objek 2D yang kita perbesar atau perkecil akan bergeser saat dilakukan scaling (perbesar atau perkecil). Sedangkan jika kita melakukan scaling atau rotasi pada saat objek berada di titik pusat (0,0) yaitu di tengah-tengah grafik pada koordinat cartesius, objek yang di scaling akan membesar atau mengecil tanpa bergeser. Mengapa hal itu dapat terjadi? Seperti itulah komposit, jadi kita akan membuat objek yang disclaing ataupun dirotasi tetapi tidak bergeser dan tetap di posisi itu hanya objeknya membesar, mengecil, atau berputar. Mengapa bisa tidak bergeser? karena titik x dan y berada di titik (0,0) jika kita masukkan pada rumus scaling maupun rotasi hasilnya akan didapat angka 0 (nol), jadi tidak aka bergeser.  Hal ini terlihat jelas pada saat kita melakukan rotasi. Pada pertemuan 5, kita melakukan rotasi, namun rotasi itu seperti bumi yang mengelilingi matahari. Untuk membuat objek berputar seperti bumi berputar pada porosnya harus dilakukan komposit. Seperti itu kurang lebih ilustrasinya.

Untuk melakukan komposit, salah satu cara yang dibahas pada pertemuan ini adalah dengan perhitungan menggunakan pivot point atau sederhananya sama dengan titik pusat dari objek yang akan dieksekusi baik scalling maupun rotasi.

Ada tiga cara untuk melakukan komposit:

Cara Pertama

Lakukan transformasi translasi satu per satu, setelah itu lakukan transformasi penyusun transformasi komposit secara berurutan (misalnya: scaling atau rotasi), tapi ingat selama proses komposit ini objek jangan digambar. Setelah selesai melakukan transformasi komposit secara berurutan, lakukan transformasi translasi untuk mengembalikan objek ke posisi semula, baru gambar objeknya.

Cara Kedua

Cari rumus kompositnya (Hati-hati, cara ini tidak fleksibel).Untuk cara ini diperlukan perhitungan matriks homogen berordo 3x3 (untuk objek 2D). disebut juga dengan Affine Matriks. Selama ini kita mengenal rumus untuk translasi, scaling, dan rotasi. Translasi: X’ = X + TX  dan  Y’ = Y + TY didapat rumus ini dari matriks di bawah ini:

Dari matriks di atas kita dapat melihat hasilnya yaitu X’ = X + TX dan Y’ = Y + TY dan 1=1. Maka didapatlah rumus translasi untuk X’ dan Y’.

Scaling: X’ = X * SX dan Y’ = Y * SY didapat dari matriks di bawah ini:

Dari matriks di atas, didapatlah rumus untuk X’ dan Y’

Rotasi: X’ = X.Cosθ – Y.Sinθ dan Y’ = X.Sinθ + Y.Cosθ diperoleh dari matriks berikut:

Dari perhitungan matriks di atas lah didapatkan rumus rotasi

Cara Ketiga

Akan dibahas pada pertemuan selanjutnya.

Pada pertemuan 6 ini akan dibahas komposit dengan menggunakan cara pertama. Ilustrasi perhitungannya dapat dilihat di bawah ini:

Gambar di atas adalah merupakan posisi awal segitiga. Segitiga tersebut akan discaling dan hasilnya segitiga tersebut tidak berpindah tempat tetapi membesar tetap di titik hitam tersebut.

Yang seperti itulah yang disebut komposit. Seperti apa cara kerja yang pertama. Berikut ilustrasi scaling dari posisi awal (segitiga biru) ke posisi akhir (segitiga merah):

Dari ilustrasi di atas, mula-mula segitiga biru dengan titik hitam dipindahkan ke titik hitam (0,0). Perhatikan gambar tersebut. Setelah berpindah ke titik tengah (0,0) segitiga baru discaling perbesar yang menghasilkan segitiga merah. Langkah terakhir, segitiga merah akan dikambalikan ke posisi titik hitam awal (tempat segitiga biru). Yang peru digambarkan dalam program nantinya hanya posisi awal dan posisi akhir, selama proses jangan digambarkan. Ilustrasi di atas hanya unuk menjelaskan alur proses scaling, jadi digambarkan dan dibedakan warnanya agar lebih mudah untuk dilihat perubahannya.

Saya rasa untuk landasan teori mengenai komposit cukup sampai di sini. Selanjutnya akan dibahas prakteknya dengan menggunakan delphi 7. Masih sama seperti pada pertemuan sebelumnya, kita bisa menggunakan form sebelumnya hanya tinggal menambahkan beberapa label, edit box dan button untuk pivot poin. Pada pertemuan ini akan dibuat di hal yaitu pivot point rotasi untuk rotasi objek pada titik pusat dan pivot point scaling untuk membuat objek membesar da mengecil dengan acuan titik pusat. Seperti biasa kita harus menyiapkan form untuk interfacenya. Tampilannya seperti berikut ini:

Kita dapat mendesain ulang seperti tampilan di atas atau langsung menambahkan dari form yang sudah kita buat di pertemuan sebelumnya. Yang penting button yang diberi tanda seperti gambar di atas kita tambahkan pada form kerja kita.

Langkah selanjutnya kita tambahkan variabel xpivot dan ypivot untuk menampung nilai yang didapatkan dari perhitungan dengan X1, X2, Y1, dan Y2. Berikut deklarasinya:

Jika kita membuat form baru tanpa melanjutkan dari pertemuan sebelumnya, di atas adalah deklarasi untuk variabel penampung yang akan kita gunakan nantinya dalam membuat aplikasi pivot point ini. Jika penulisan kode program belum jelas, tidak usah khawatir, pada akhir pembahasan akan ada full kode programnya untuk pembuatan form pada pertemuan ini. Yang sekarang dijelaskan hanya potongan program yang bersangkutan dengan pembahasan pertemuan ini dan keterangan fungsi dan logika jalannya program. Lanjut ke langkah selanjutnya yaitu membuat fungsi atau prosedur untuk gambar, button gambar di sini kembali dibahas karena pada langkah ini saat kita menggambarkan objek, nilai xipvot dan ypivot akan langsung dihitung dan akan langsung dicetak pada edit box untuk Xpivot dan Ypivot. Berikut ini adalah kode programnya:

Dari kode program di atas, maksdunya adalah bahwa pada saat kita menggambar, nilai pivot point untuk x dan y sudah langsung dibuat atau dihitung. Dan langsung dicetak atau diisi ke editbox XPivot dan YPivot. Sehingga pada saat kita jalankan, tampilannya adalah sebagai berikut:

Nilai XPivot dan YPivot akan terisi secara otomatis saat button gmbar diklik.

Langkah selanjutnya adalah untuk fungsi atau prosedur button Pivot Point Scaling:

Untuk kode scaling dan translasi pertama tanpa penulisan image line to juga bisa, karena seharusnya hnya ditampung pada variabel dan pada saat translasi untuk kembali ke posisi awal baru digambar (ingat aturan cara 1). Nanti akan dituliskan kode program tanpa line to selama proses pada bagian pivot point rotasi. Sebenarnya ini hanya pengembangan dari rumus translasi, scaling, dan rotasi yang telah kita gunakan untuk membuat kode program pada pertemuan-pertemuan yang lalu. Kita lihat tampilannya adalah sebagai berikut:

Terlihat bahwa objek bintang bertambah besar dan tidak bergeser seperti saat kita menekan tombol scaling. Barikutnya akan dibahas untuk pembuatan pivot point rotasi:

Terlihat dari kode di atas bahwa menggambar hanya dilakukan pada saat objek dikembalikan ke posisi semula. Hasil tampilannya adalah sebagai berikut:

Dari hasil di atas terlihat bahwa bintang berputar 30° tanpa berpindah tempat, hanya berputar para titik tengahnya. Berikut ini adalah kode program keseluruhan dari praktikum ini:

Demikian pembahasan pada komputer grafis 6 ini. Untuk rotasi masih ada kesalahan yang membuat perputaran bintang menjadi tidak sempurna. Untuk itu pada pertemuan selanjutnya akan coba untuk diperbaiki kesalahan ini.

Tetap jadi pembaca setia blog ini ya.. semoga bisa bermanfaat.. ^.^