Transformasi 2D
Dasar Teori
Viewport
Objek yang
akan digambar pada layar biasanya memiliki ukuran yang jauh lebih besar
dibanding ukuran layar, sehingga perlu dilakukan pemetaan/transformasi
yang memungkinkan objek tersebut bisa digambar pada layar. Meskipun
demikian, objek seringkali terlalu rumit untuk ditampilkan pada layar
dengan koordinat yang sangat terbatas. Sehingga biasanya kita memilih
bagian tertentu dari objek untuk ditampilkan pada layar. Didalam
memilih objek yang akan ditampilkan biasanya dibatasi oleh sebuah kotak
yang disebut dengan jendela (window).
Dalam praktek kita bisa
menggunakan seluruh atau sebagian lebar layar untuk menmpilkan objek
yang berada pada sebuah jendela. Daerah layar yang dipilih untuk
menampilkan objek yang dimaksud disebut viewport. Dalam keadaan normal,
viewport akan meliputi seluruh layar lebar. Meskipun demikian, kita bisa
memilih bagian tertentu dari layar untuk dijadikan sebuah viewport.
Transformasi Sejumlah
objek seringkali mempunyai sifat simetri. Sehingga untuk menggambar
seluruh objek, cukup dilaksanakan dengan melakukan manipulasi terhadap
objek yang sudah ada, misalnya dengan pencerminan, pergeseran, atau
pemutaran objek yang sudah digambar terlebih dahulu.
Kita akan
mempelajari cara mentransformasikan objek grafis khususnya objek grafis
2D sebagai salah satu cara untuk memanipulasi objek grafis dan sistem
koordinat yang dipakai dengan cara yang lebih terorganisir dan efisien.
Salah satu contoh penting untuk diketahui adalah pemakaian transformasi
jendela ke viewport.
Ada dua cara untuk melakukan transformasi, yaitu transformasi objek dan transformasi kordinat. Pada transformasi objek semua titik pada sembarang objek akan dirubah sesuai dengan aturan tertentu sementara kordinatnya tetap. Pada transformasi sistem koordinat, objek tetap tetapi karena sistem koordinatnya diganti maka kedudukan objek harus disesuaikan dengan kedudukan sistem kordinat yangbaru.
Ada dua cara untuk melakukan transformasi, yaitu transformasi objek dan transformasi kordinat. Pada transformasi objek semua titik pada sembarang objek akan dirubah sesuai dengan aturan tertentu sementara kordinatnya tetap. Pada transformasi sistem koordinat, objek tetap tetapi karena sistem koordinatnya diganti maka kedudukan objek harus disesuaikan dengan kedudukan sistem kordinat yangbaru.
Jenis-jenis transformasi
1.Translasi
Sembarang titik
pada bidang xy bisa digeser ke sembarang tempat dengan menambahkan
besaran pada absis x dan ordinat y. Translasi adalah transformasi dengan
bentuk tetap memindahkan objek apa adanya. Dengan menggunakan
persamaan Q = PM + tr, maka hasil pergeseran bisa dinyatakan sbb:
(Qx, Qy) = (Px +trx, Py+try)
Sembarang objek bisa digeser ke posisinya yang baru dengan
mengoperasikan persamaan diatas pada setiap titik dari objek tersebut.
Hal ini karena setiap garis dari objek tersebut terdiri dari titik-titik
yang jumlahnya tak terbatas, maka proses penggeseran bisa berlangsung
sangat lama. Tetapi pada kenyataannya kita cukup menggeser dua titik
ujungnya saja dan kemudian menggandeng dua titik tersebut untuk
membentuk garis hasil pergeseran.
Contoh translasi:
Untuk menggambarkan translasi objek yang berupa garis dengan koordinat A(10,10), B(30,10) dengan vektor translasi (10,20)
Contoh translasi:
Untuk menggambarkan translasi objek yang berupa garis dengan koordinat A(10,10), B(30,10) dengan vektor translasi (10,20)
Titik A Qx=Px +trx =10 + 10 =20
Qy=Py + try =10+20=30
Hasil translasi A = (20, 30)
Titik B Qx=Px + trx = 30+10 = 40
Qy=Py + try = 10+20 =30
Hasil translasi B = (40, 30)
2.Rotasi
Kita
bisa memutar objek searah dengan arah perputaran jarum jam(dinyatakan
dengan sudut negatif) atau berlawanan arah dengan arah jarum
jam(dinyatakan sebagai sudut positif).
Dengan menganggap bahwa besarnya sudut putar adalah sama dengan , maka posisi sebuah titik yang baru adalah:
Qx = Pxcos() - Pysin()Dengan menganggap bahwa besarnya sudut putar adalah sama dengan , maka posisi sebuah titik yang baru adalah:
Qy = Pxsin() + Pycos()
Dengan menggunakan notasi matrix, maka besaran M bisa dikatakan sbb:
M =cos(0) sin(0)
-sin(0) cos(0)
3.Skala
Penskalaan
adalah proses untuk memperbesar atau memperkecil suatu gambar. Dengan
faktor absolut yang lebih besar dari 1, akan diperoleh gambar yang lebih
besar dan semakin menjauh dari titik(0,0). Sebaliknya dengan faktor
skala yang mempunyai nilai absolut lebih kecill dari 1, akan diperoleh
gambar yang lebih kecil dan mendekat ke titik (0,0).
Dengan menggunakan persamaan Q=PM+tr, maka hasil penggeseran bisa dinyatakan sebagai:(Qx, Qy)=(SxPx, SyPy)
Dengan Sx adalah faktor skala ke arah mendatar dan Sy adalah faktor skala arah tegak dan ofset vektor tr bernilainol. Dengan menggunakan notasi matrix, maka matrixM bisa dinyatakan sbb:
M= (sx 0)
(0 sy)
PROGRAM TRANSFORMASI
Dengan memakai delphi, Buatlah program dengan tampilan seperti dibawah ini. Bila program dijalankan, ada dua pilihan:
Jenis transformasi Memutar
Jika memilih transformasi memutar kita disuruh menginputkan besar sudut yang diminta dan kemudian inputkan x1, y1, x2, y2 lalu klik gambar maka akan tampil gambar pada kotak paintbox dan klik transformasi maka gambar akan memutar sesuai sudut yang diisi. Dan gambar asli tetap nampak.
Jenis transformasi Perbesar/perkecil
Jika memilih transformasi perbesar/perkecil kita disuruh menginputkan besar skalanya dan kemudian inputkan x1, y1, x2, y2 lalu klik gambar maka akan tampil gambar pada kotak paintbox dan klik transformasi maka gambar akan tampil sesuai skala yang diisi.
Jenis transformasi Memutar
Jika memilih transformasi memutar kita disuruh menginputkan besar sudut yang diminta dan kemudian inputkan x1, y1, x2, y2 lalu klik gambar maka akan tampil gambar pada kotak paintbox dan klik transformasi maka gambar akan memutar sesuai sudut yang diisi. Dan gambar asli tetap nampak.
Jenis transformasi Perbesar/perkecil
Jika memilih transformasi perbesar/perkecil kita disuruh menginputkan besar skalanya dan kemudian inputkan x1, y1, x2, y2 lalu klik gambar maka akan tampil gambar pada kotak paintbox dan klik transformasi maka gambar akan tampil sesuai skala yang diisi.
programnya adalah sbb:
rogram transformasi gambar
procedure TForm1.GambarClick(Sender: TObject);
begin
if ((IsiX1.Text='')or (IsiX2.text='') or (IsiY1.text='' )or (IsiY2.text='')or
(IsiX1.Text=' ')or (IsiX2.text=' ') or (IsiY1.text=' ' )or (IsiY2.text=' ')) then
MessageDlg('X1, Y1, X2 dan Y2 harus anda isi',mtWarning, [mbOk],0)
else
with ttk do
begin
x1 := strtoint(IsiX1.Text);
y1 := strtoint(IsiY1.Text);
x3 := strtoint(IsiX2.Text);
y3 := strtoint(IsiY2.Text);
x2 := x3;
y2 := y1;
x4 := x1;
y4 := y3;
xn := (x3 + x1) div 2;
yn := (y3 + y1) div 2;
PaintBox1.Canvas.Brush.Color := claqua;
Paintbox1.Canvas.Polygon([Point(x1, y1), Point(x2, y2), point(x3, y3), Point(x4, y4)]);
end;
end;
procedure TForm1.RadioTransformasiClick(Sender: TObject);
begin
if RadioTransformasi.ItemIndex =0 then
begin
Label1.Caption := 'Besar Sudut';
pil.caption:='Derajat';
end
else
begin
Label1.Caption := 'Besar Skala';
pil.caption:='Kali';
end;
end;
{ procedure transformasi }
procedure TForm1.TransformasiClick(Sender: TObject);
var
temp : Titik;
tet : integer;
s, kali : real;
lebar, tinggi : integer;
begin
{transformasi untuk memutar }
if ((IsiX1.Text='')or (IsiX2.text='') or (IsiY1.text='' )or (IsiY2.text='')or
(IsiX1.Text=' ')or (IsiX2.text=' ') or (IsiY1.text=' ' )or (IsiY2.text=' ')
or (IsiPil.text='')or (IsiPil.text=' ') or (RadioTransformasi.ItemIndex=-1)) then
MessageDlg('PENGISIAN DATA BELUM LENGKAP',mtWarning, [mbOk],0)
else
if RadioTransformasi.itemindex = 0 then
begin
with ttk do
begin
tet:=strtoint(IsiPil.text);
s := tet * pi / 180;
temp.x1 := xn + round((x1 - xn)*(cos(s))-(y1 - yn)*(sin(s)));
temp.x2 := xn + round((x2 - xn)*(cos(s))-(y2 - yn)*(sin(s)));
temp.x3 := xn + round((x3 - xn)*(cos(s))-(y3 - yn)*(sin(s)));
temp.x4 := xn + round((x4 - xn)*(cos(s))-(y4 - yn)*(sin(s)));
temp.y1 := yn + round((x1 - xn)*(sin(s))+(y1 - yn)*(cos(s)));
temp.y2 := yn + round((x2 - xn)*(sin(s))+(y2 - yn)*(cos(s)));
temp.y3 := yn + round((x3 - xn)*(sin(s))+(y3 - yn)*(cos(s)));
temp.y4 := yn + round((x4 - xn)*(sin(s))+(y4 - yn)*(cos(s)));
end;
ttk.x1 := temp.x1;
ttk.x2 := temp.x2;
ttk.x3 := temp.x3;
ttk.x4 := temp.x4;
ttk.y1 := temp.y1;
ttk.y2 := temp.y2;
ttk.y3 := temp.y3;
ttk.y4 := temp.y4;
PaintBox1.Canvas.Brush.Color :=clred;
with ttk do
Paintbox1.canvas.Polygon([Point(x1, y1), Point(x2, y2), Point(x3, y3), Point(x4, y4)]);
end
{transformasi untuk memperbesar/memperkecil }
else
begin
kali :=strtofloat(IsiPil.text);
with ttk do
begin
lebar := x3 - x1;
tinggi := y3 - y1;
x1 := xn - round(lebar / 2 * kali );
x3 := xn + round(lebar / 2 * kali );
y1 := yn - round(tinggi / 2 * kali );
y3 := yn + round(tinggi / 2 * kali );
x2 := x3;
y2 := y1;
x4 := x1;
y4 := y3;
end;
PaintBox1.Canvas.Brush.Color := clblue;
with ttk do
Paintbox1.canvas.Polygon([Point(x1, y1), Point(x2, y2), Point(x3, y3), Point(x4, y4)]);
end;
end;
procedure TForm1.KeluarClick(Sender: TObject);
begin
Close;
end;
procedure TForm1.HapusClick(Sender: TObject);
begin
Paintbox1.Refresh;
Label1.caption := 'Pilihan ';
IsiPil.text := ' ';
IsiX1.text := ' ';
IsiX2.text := ' ';
IsiY1.text := ' ';
IsiY2.text := ' ';
RadioTransformasi.itemindex := -1 ;
end;