Post on 01-Jan-2016
description
Setiawan Hadi UNPAD3.1Grafika Komputer
TRANSFORMASI 2 DIMENSI
• Dasar
• Representasi Titik dan Transformasi
• Transformasi Titik
• Transformasi Garis
• Rotasi
• Refleksi
• Skala
• Transformasi Kombinasi
Setiawan Hadi UNPAD3.2Grafika Komputer
• Why do we need geometric transformations in CG?– As a viewing aid– As a modeling tool– As an image manipulation tool
Motivasi
Setiawan Hadi UNPAD3.3Grafika Komputer
REPRESENTASI TITIK DAN TRANSFORMASI
• Sebuah titik direpresentasikan secara dua dimensi melalui koordinatnya
• Transformasi dan Matriks
( , )x y dituliskan x y
atau x
y
A T B Matriks A ditransformasikan dengan matriks transformasi T menghasilkan matriks B
Setiawan Hadi UNPAD3.4Grafika Komputer
TRANSFORMASI TITIK
* *( ) ( )a b
X T x y ax cy bx dy x yc d
Sebuah titik X ditransformasikan dengan matriks T diformulasikan sebagai berikut
Evaluasi nilai a, b, c, d
a. Jika a=d=1 dan c=b=0 Matriks Identitasb. Jika d=1, b=c=0 Skala pada komponen xc. Jika b=c=0 Skala pada komponen x dan yd. Jika a=d > 1 Enlargmente. Jika 0<a=d<1 Compressionf. Jika a=1, d=-1, b=c=0 Refleksi pada sumbu xg. Jika a=-1, b=c=0, d=1 Refleksi pada sumbu yh. Jika a=d=1, c=0 Shear
Setiawan Hadi UNPAD3.5Grafika Komputer
TRANSFORMASI GARIS
• Transformasi garis lurus– Sebuah garis yang melalui titik A(0,1) dan titik B(2,3) yang
ditransformasikan dengan matriks
– Menghasilkan
– Dapat ditulis
1 2
3 1T
*
*
1 20 1 3 1
3 1
1 22 3 11 7
3 1
A T A
B T B
*0 1 1 2 3 1
2 3 3 1 11 7L T L
Setiawan Hadi UNPAD3.6Grafika Komputer
ROTASI
• Sumbu rotasi pada sumbu origin yaitu titik (0,0)
• Rotasi dengan sudut istimewa 90°, 180°, 270°, 360°
• Diketahui koordinat titik yang membentuk segitiga {(3, -1), (4, 1), (2, 1). Gambarkan objek tersebut kemudian gambarkan pula objek baru yang merupakan transformasi rotasi objek lama sebesar 90° CCW dengan pusat rotasi (0,0).
90 180
270 360
0 1 1 0
1 0 0 1
0 1 1 0
1 0 0 1
T T
T T
Setiawan Hadi UNPAD3.7Grafika Komputer
ROTASI DENGAN SUDUT TERTENTU
• Pusat rotasi tetap pada origin
• Menggunakan cara polar
' ' '
'
'
' '
cos sin
cos sin
cos( ) sin( )
(cos cos sin sin ) (sin cos cos sin )
cos sin ) sin cos sin )
cos sin cos sin
cos sin
cos sin
cos sin
si
cos
P x y r r
P x y r r
r r
x
y
x y
r r r r
x y y x
x y
y
x y
x
n cos
Rotasi sebesar θ˚ CCW
Setiawan Hadi UNPAD3.8Grafika Komputer
ILUSTRASI REFLEKSI
x
y 1
32
1’
3’2’x
y1
32
1’
3’ 2
x
y
3
1’
3’ 2
1
2
x
y
Setiawan Hadi UNPAD3.9Grafika Komputer
REFLEKSI
• Pencerminan pada sumbu utama (absis dan ordinat)
• Latihan– Diketahui sebuah objek dengan pasangan koordinat {(4,1),
(5,2), (4,3)}. (a) Refleksikan pada cermin yang terletak pada sumbu x (b) Refleksikan pada garis y=-x.
1 0
0 1T
Refleksi pada sumbu x atau 0y
1 0
0 1T
Refleksi pada sumbu y atau 0x
0 1
1 0T
Refleksi pada sumbu y x
0 1
1 0T
Refleksi pada sumbu y x
Setiawan Hadi UNPAD3.10Grafika Komputer
ILUSTRASI REFLEKSI
x
y 1
32
1’
3’2’x
y1
32
1’
3’ 2
x
y
3
1’
3’ 2
1
2
x
y
Setiawan Hadi UNPAD3.11Grafika Komputer
SKALA DAN TRANSFORMASI KOMBINASI
• Skala– Ada dua jenis penskalaan yaitu uniform scaling (us)
dan non-uniform scaling (ns)– us : a=d, b=c=0; – ns : a≠d, b=c=0– kompresi : a=d<1; – ekspansi : a=d>1
• Transformasi Kombinasi
1 2 2 1
1 2 1 2
X T T X T T
X T T X T T
(a,b)
Setiawan Hadi UNPAD3.12Grafika Komputer
SHEAR
x
y
x
y
(0,0) (1,0)
(1,1)(0,1)
(0,0) (1,0)
(3,1)(2,1)x
y
x
y
(0,0) (1,0)
(1,1)(0,1)(1/2,0)
(3/2,0)
(2,1)(1,1)
(0,-1)
x
y
x
y
(-1,0)(1,0)
(1,1)(0,1/2) (1,1)
(1,2)(0,3/2)
Setiawan Hadi UNPAD3.13Grafika Komputer
TRANSFORMASI KOORDINAT HOMOGEN
• Koordinat homogen
• Rotasi pada pusat rotasi sembarang
• Refleksi pada cermin yang berada pada posisi garis sumbu sembarang
Setiawan Hadi UNPAD3.14Grafika Komputer
KOORDINAT HOMOGEN
• Origin bersifat INVARIAN. Koordinatnya tidak akan pernah berubah. Jika ditransformasikan, akan tetap di (0,0).
• Dalam kondisi nyata, origin tidak harus selalu absolut di (0,0). Untuk itu digunakan koordinat homogen
• Koordinat homogen memetakan titik (0,0) ke posisi lain. Untuk itu ada elemen tambahan pada matriks transformasi
• Matriks Transformasi Umum (MTU)`
a b p
T c d q
m n s
a, b, c, d merupakan elemen untuk skala, rotasi,refleksi dan shearingm, n merupakan elemen untuk translasis adalah elemen untuk overal scalingp, q adalah elemen untuk proyeksi
Setiawan Hadi UNPAD3.15Grafika Komputer
ROTASI PADA SUMBU SEMBARANG
• Jika sebuah objek dirotasikan sebesar θ° dengan pusat rotasi (m, n), maka langkah-langkah yang harus dilakukan adalah1. Translasikan pusat rotasi ke (0, 0); karena yang kita
ketahui hanyalah rumus rotasi pada origin2. Lakukan rotasi sebesar yang diinginkan3. Re-translasi pusat rotasi ke posisi semula
• MTU
* *
1 0 0 cos sin 0 1 0 0
0 1 0 sin cos 0 0 1 0
1 0 0 1 1
1 1
T
m n m n
x y x y T
Setiawan Hadi UNPAD3.16Grafika Komputer
ILUSTRASI
1 0 0
0 1 0
1m n
cos sin 0
sin cos 0
0 0 1
1 0 0
0 1 0
1m n
Setiawan Hadi UNPAD3.17Grafika Komputer
Ilustrasi Lainnya
Translate Rotate Translate
(xr,yr)
(xr,yr)
(xr,yr)
(xr,yr)
Setiawan Hadi UNPAD3.18Grafika Komputer
REFLEKSI PADA GARIS SEMBARANG
• Langkah-langkah1. Translasikan cermin sedemikian rupa sehingga menyentuh
titik origin2. Rotasikan cermin sehingga berimpit dengan salah satu
sumbu utama3. Refleksikan objek4. Re-rotasi5. Re-translasi
• Jadi MTU terdiri dari 5 buat matriks transformasi sebagai berikut:
1 1Rr rT T Rot Rot T
Setiawan Hadi UNPAD3.19Grafika Komputer
Latihan 1
Diketahui sebuah objek dengan koordinat
{(0,0), (2,2), (2,1), (6,1), (6,-1), (2, -1), (-2,-2)}
a. Rotasikan objek sebesar 45º CCW dengan pusat rotasi pada (9, 4)
b. Rotasikan objek sebesar 30º CW dengan pusat rotasi pada (-3,5)
1. Gambarkan objek asli2. Tentukan MTU3. Tentukan Koordinat Objek Baru4. Gambarkan objek hasil transformasi
Setiawan Hadi UNPAD3.20Grafika Komputer
Jawab 1a
Setiawan Hadi UNPAD3.21Grafika Komputer
Jawab 1b
Setiawan Hadi UNPAD3.22Grafika Komputer
Diketahui sebuah objek dengan koordinat
{(0, 0), (1, -2), (3, 3), (2, 3), (1, 1), (0, 2), (-1, 1), (-2, 3) , (-3, 3), (-1, -2), (0, 0)}.
a. Refleksikan objek di atas pada cermin yang berimpit dengan garis y = –x+9.
b. Refleksikan objek di atas pada cermin yang berimpit dengan garis y = x+9.1. Gambarkan objek asli2. Tentukan MTU3. Tentukan Koordinat Objek Baru4. Gambarkan objek baru hasil transformasi
Latihan 2
Setiawan Hadi UNPAD3.23Grafika Komputer
Jawab 2a
Setiawan Hadi UNPAD3.24Grafika Komputer
Jawab 2b
Setiawan Hadi UNPAD3.25Grafika Komputer
1. Tentukan titik-titik dijital untuk garis antara (-3,5) dan (8,-7) dengan algoritma DDA dan Bresenham
2. Tentukan titik-titik dijital untuk lingkaran dengan pusat 3,5 dan diameter 8
3. A. Turunkan matriks transformasi umum (MTU) untuk rotasi dengan pusat rotasi pada sebuah titik sembarang (0, 0) dan sudut rotasi sebesar searah jarum jam (clock wise).
B. Berdasarkan hasil A. tentukan matriks transformasi umum (MTU) untuk rotasi dengan pusat rotasi pada sebuah titik sembarang (x, y) dan sudut rotasi sebesar searah jarum jam (clock wise).
•
Soal-soal
Setiawan Hadi UNPAD3.26Grafika Komputer
Diketahui sebuah objek sebagai berikut
Tentukan koordinat objek pada viewport dan gambarkan jika diketahui koordinat windows (Xwmain, Ywmin dan Xwmax, Ywmax) adalah (0,0, 12, 14) dan koordinat viewport (Xvmin, Yvmin, Xvmax, Yvmax) adalah (2,2, 10,10)
Soal-soal
Setiawan Hadi UNPAD3.27Grafika Komputer
Soal-soal
Setiawan Hadi UNPAD3.28Grafika Komputer
Soal-soal
Setiawan Hadi UNPAD3.29Grafika Komputer
Soal-soal
Setiawan Hadi UNPAD3.30Grafika Komputer
Soal-soal
Setiawan Hadi UNPAD3.31Grafika Komputer
• Demo– Transformation Tester– Cabri 2D
• Artikel– OpenGL
Visual Studio .NET/C++, C# Java (JOGL)
– GDI+ Visual Studio .NET/C#
– WPF, Silverlight– Flash– Mobile Programming Visual Studio dan Java
Lain-lain
Graphics Using C# - Shortcut.lnk
Setiawan Hadi UNPAD3.32Grafika Komputer
• Senin 7 Maret 2011
• Membawa Kalkulator
• Tidak boleh saling meminjam Kalkulator
• Boleh membawa cheatsheet maksimal 1 lembar
• Materi:– Teori dasar– Algoritma Penggambaran Garis– Algoritma Penggambaran Lingkaran– Transformasi 2 dimensi (NON HOMOGEN)
QUIZ1