Grafika Komputer (TIZ10)

Presentasi berjudul: "Grafika Komputer (TIZ10)"— Transcript presentasi:

1 Grafika Komputer (TIZ10)
Tranformasi Grafik 2D Teady Matius –

2 Matriks Tranformasi Matriks Tranformasi 2D menggunakan matriks 3 x 3

3 Matriks Identitas

4 Translasi Perpindahan Objek dari titik P ke titik P’ secara linier
x’ = x + dx y’ = y + dy x, y koordinat saat ini. x’, y’ : koordinat yang baru dx: jarak perpindahan arah sumbu x dy: jarak perpindahan searah sumbu y Sumber gambar: Hearn & Pauline Baker, Computer Graphics C Version

5 Contoh Translasi Sumber gambar: Hearn & Pauline Baker, Computer Graphics C Version

6 Matriks Translasi

7 Rumus Dasar Translasi x’= x + dx y’= y + dy

8 Fungsi CopyRect() Delphi
Class Canvas delphi mempunyai fungsi CopyRect() untuk memindahkan citra dalam suatu bidang segiempat. Syntax: CopyRect(const Dest: TRect; Canvas: TCanvas; const Source: TRect);

9 Implementasi Persamaan Translasi pada delphi
//Ambil nilai dx dan dy dX := StrToInt(EditDx.Text); dY := StrToInt(EditDy.Text); //Persamaan Translasi //Menentukan titik awal pepindahan newX := curX + dX; newY := curY + dY;

10 Contoh Translasi dengan Raster
//copykan Grafik ke Temporary Image1.Canvas.CopyRect(Rect(0,0,lebar,tinggi), Form1.Canvas, Rect(curX, curY, curX + lebar, curY+tinggi)); //hapus grafik asal for i:=0 to tinggi-1 do for j:=0 to lebar-1 do canvas.Pixels[curX + j, curY + i] := clBtnFace; //buat grafik baru, grafik di ambil dari temporary begin canvas.Pixels[newX + j, newY + i] := Image1.Canvas.Pixels[j, i]; end;

11 Contoh Translasi dengan Vektor
//hapus dahulu grafik lama canvas.Pen.Color := clBtnFace; canvas.Ellipse(curX, curY, curX+lebar, curY+tinggi); //gambar grafik baru canvas.Pen.Color := clBlack; canvas.Ellipse(newX, newY, newX+lebar, newY+tinggi);

12 Contoh Translasi dengan CopyRect()
Image1.Canvas.CopyRect(Rect(0,0,lebar,tinggi), Form1.Canvas, Rect(curX,curY,curX+lebar,curY+tinggi)); canvas.Pen.Color := clBtnFace; canvas.Rectangle(curX,curY,curX+lebar,curY+tinggi); Canvas.CopyRect(Rect(newX, newY, newX+lebar, newY+tinggi),Image1.Canvas,Rect(0,0,lebar, tinggi));

13 Contoh Translasi procedure TForm1.ButtonPindahClick(Sender: TObject);
var i, j : integer; begin dX := StrToInt(EditDx.Text); dY := StrToInt(EditDy.Text); newX := curX + dX; newY := curY + dY; if CheckBoxCopyRect.Checked then Image1.Canvas.CopyRect(Rect(0,0,lebar,tinggi),Form1.Canvas,Rect(curX,curY,curX+lebar,curY+tinggi)); canvas.Pen.Color := clBtnFace; canvas.Rectangle(curX,curY,curX+lebar,curY+tinggi); Canvas.CopyRect(Rect(newX, newY, newX+lebar, newY+tinggi),Image1.Canvas,Rect(0,0,lebar, tinggi)); end else if rgTranslasi.ItemIndex = 0 then //copykan Grafik ke Temp //hapus grafik asal for i:=0 to tinggi-1 do for j:=0 to lebar-1 do canvas.Pixels[curX + j, curY + i] := clBtnFace; //buat grafik baru canvas.Pixels[newX + j, newY + i] := Image1.Canvas.Pixels[j, i]; end; //hapus dahulu grafik lama canvas.Ellipse(curX, curY, curX+lebar, curY+tinggi); //gambar grafik baru canvas.Pen.Color := clBlack; canvas.Ellipse(newX, newY, newX+lebar, newY+tinggi); curX := newX; curY := newY;

14 Penskalaan Sumber gambar: Hearn & Pauline Baker, Computer Graphics C Version

15 Matriks Skala

16 Rumus Dasar Penskalaan
x’ = x . Sx y’ = y . Sy

17 Implementasi persamaan Scaling pada Delphi
//Menentukan titik awal perpindahan newX := round(curX * sX); newY := round(curY * sY);

18 Rotasi Ide dasar dari rotasi adalah melakukan perputaran pada sumbunya. Koordinat yang di pergunakan untuk perhitungan adalah koordinat kartesian Karena koordinat sumbu y delphi berbeda, maka harus dilakukan penyesuaian

19 Matriks Rotasi (koordinat kartesius)

20 Rumus Dasar Rotasi (koordinat kartesius)
x’ = x cos() - y sin() y’ = x sin() + y cos()

21 Matriks Rotasi (koordinat Delphi)

22 Rumus Dasar Rotasi (koordinat Delphi)
x’ = x cos() + y sin() y’ = -x sin() + y cos() harus di ubah dahulu ke radian untuk dihitung sin() dan cos() nya,  *  / 180

23 Shearing Tranformasi dengan membebani pada sisi tertentu, sehingga di hasilkan objek yang terdistorsi Contoh: huruf italic: Y  Y Sumber gambar: Hearn & Pauline Baker, Computer Graphics C Version

24 Shearing searah sumbu X
Rumus Dasar x’ = x +y.shx y’ = y

25 Shearing berdasarkan  atau shx?
Pada dasarnya shearing akan melakukan tranformasi pada setiap titik berdasarkan kemiringan yang dihasilkan dari shx Pada operasi vektor x’ didapatkan dari x’ = x+ y.shx Sehingga tidak menjadi masalah, karena hanya perlu menggambar ulang dengan vektor-vektor yang didapat. Tetapi pada operasi raster, atau objek lebih satu setiap titik harus dihitung berdasarkan sudut kemiringannya Karena itu sebaiknya operasi shering dilakukan berdasarkan sudut kemiringannya. Pada operasi raster ataupun grafik yang objeknya lebih dari satu, jika diketahui shx, cari sudut kemiringannya!!!

26 Mendapatkan  dari y dan shx
Jika  adalah sudut kemiringan, tan( ) = y/shx  = arctan(y/shx) / * 180  = 90 – 

27 Shearing searah sumbu X (menggunakan sudut )
Rumus Dasar x’ = x + y.shx x’ = x + y . cos()/sin() y’ = y tan() = h/shx  shx = h / tan() tan() = sin() / cos() shx = h / tan() shx = h / (sin() / cos()) shx = h . (cos() / sin())

28 Contoh Shear X Sumber gambar: Hearn & Pauline Baker, Computer Graphics C Version

29 Shearing searah sumbu Y
Rumus Dasar x’ = x y’ = y +x.shy

30 Shearing searah sumbu Y (menggunakan sudut )
Rumus Dasar x’ = x y’ = y +x.shy y’ = y + x.cos()/sin() Dengan cara yang sama dengan shear x, didapatkan rumus dasar untuk shear y berdasarkan sudut kemiringannya.

31 Shear Y

32 Shear XY

33 Matriks Shear X dan Y

34 Latihan Susunlah matrik shear x y berdasarkan sudut , dan carilah persamaannya untuk mendapatkan x’ dan y’

35 Tugas 3 Buatlah program untuk memanggil gambar dan menampilkan pada TImage Buatlah program untuk menyimpan gambar dari TImage ke sebuah file

36 Tugas 4 Buatlah program untuk menampilkan gambar dan mengcopykan gambar tersebut ke komponen TImage yang lain dengan menggunakan CopyRect() Buatlah program untuk menampilkan gambar dan mengcopykan gambar tersebut ke komponen TImage yang lain dengan cara dicopykan pixel per pixel