Tugas Grafika Tranformasi 2 Dimensi

Transformasi 2 Dimensi

Grafika komputer merupakan bidang yang menarik minat banyak orang.  Salah sub bagian dari grafika komputer adalah pemodelan objek (object modelling). Dalam pemodelan objek dua dimensi (2D), didapati berbagai objek dapat dimodelkan menurut kondisi tertentu, objek yang dimodelkan itu perlu dimodifikasi.  Pemodifikasian objek ini dapat dilakukan dengan melakukan berbagai operasi fungsi atau operasi transformasi geometri. Transformasi ini dapat berupa transformasi dasar ataupun gabungan dari berbagai transformasi geometri. Pada dasarnya, transformasi ini adalah memindahkan objek tanpa merusak bentuk.

Tujuan transformasi adalah :

•  Merubah atau menyesuaikan komposisi pemandangan 
• Memudahkan membuat objek yang simetris 
•   Melihat objek dari sudut pandang yang berbeda 
• Memindahkan satu atau beberapa objek dari satu tempat ke tempat lain, ini biasa dipakai untuk animasi komputer.

Proses transformasi dilakukan dengan mengalikan matriks objek dengan matriks transformasi, sehingga menghasilkan matriks baru yang berisi koordinat objek hasil transformasi

1. Translasi

Gambar 1 Hasil Translasi menggunakan program Processing

Translasi merupakan proses memindahkan suatu objek sepanjang garis lurus dari suatu lokasi koordinat tertentu ke lokasi yang lain. 

Translasi dilakukan dengan penambahan translasi pada suatu titik koordinat dengan translation vector atau shift vector, yaitu(tx, ty), dimana :

tx : translasi vector sumbu x

ty : translasi vector sumbu y

Koordinat baru titik yang ditranslasi dapat diperoleh dengan menggunakan rumus :

x’ = x + tx

y’ = y + ty

Dimana (x, y) adalah koordinat asal suatu objek sedangkan (x’, y’) koordinat baru objek setelah ditranslasi.

Contoh:

Untuk menggambarkan translasi suatu objek yang berupa segitiga dengan koordinat  A(10,10), B(30,10), dan C(10,30) dengan translation vector (10,20).

Pertama-tama dihitung koordinat hasil translasi satu demi satu.

TVektor = (10,20)

Titik A (10,10)

x’= (10+10) = 20

y’= (10+20) = 30

Hasil translasi Titik A’ = (20,30)

Titik B (30,10)

x’= (30+10) = 40

y’= (10+20) = 30

Hasil translasi Titik B’ = (40,30)

Titik C (10,30)

x’= (10+10) = 20

y’= (30+20) = 50

Hasil translasi Titik C’ = (20,50)

Listing translasi yang digunakan dalam program Processing adalah:

void setup()
{
size(300,300);
background(255);
noStroke();
beginShape(TRIANGLES);
fill(220);
vertex(10,10);
vertex(30,10);
vertex(10,30);
fill(255);
vertex(10+10,10+20);
vertex(30+10,10+20);
vertex(10+10,30+20);
fill(128);
pushMatrix();
translate(10,20);
vertex(10,10);
vertex(30,10);
vertex(10,30);
popMatrix();
endShape();
}

Tampilan dari hasil listing translasi diatas dapat dilihat pada gambar 1. (Aisyah NF)

2.  Skala

Gambar 2 Hasil Skala menggunakan program Processing

Transformasi skala merupakan perubahan ukuran suatu objek. Koordinat baru diperoleh  dengan   melakukan  perkalian nilai koordinat dengan skala factor, yaitu (sx,sy) dimana :

sx  = skala factor untuk sumbu x

sy  = skala factor untuk sumbu y.

Koordinat  baru titik yang diskala dapat diperoleh dengan:

x’ = x . sx

y’ = y . sy

Skala factor sx dan sy dapat diberikan sembarang nilai positif. Nilai lebih dari 1 menandakan bahwa sebuah objek diperbesar sedang nilai nilai kurang dari 1 menunjukkan bahwa objek diperkecil.

Contoh:

Untuk menggambarkan skala suatu objek yang merupakan segi empat dengan koordinat A(10,10), B(30,10), C(30,20) dan D (10,20) diskala dengan skala factor (3,2).

Pertama-tama dihitung koordinat hasil skala satu demi satu. 

SVektor = (3,2)

Titik A (10,10)

x’= (10.3) = 30

y’= (10.2) = 20

Hasil skalaTitik A’ = (30,20)

Titik B (30,10)

x’= (30.3) = 90

y’= (10.2) = 20

Hasil skalaTitik B’ = (90,20)

Titik C (30,20)

x’= (30.3) = 90

y’= (20.2) = 40

Hasil skalaTitik C’ = (90,40)

Titik D (10,20)

x’= (10.3) = 30

y’= (20.2) = 40

Hasil skalaTitik C’ = (30,40

Listing skala yang digunakan dalam  program Processing :

void setup()
{
size(400,400);
background(255);
stroke(128);
rect(10,30,30,10);
stroke(0);
pushMatrix();
scale(3.2);
rect(10,30,30,10);
popMatrix();
}

                Tampilan dari hasil listing skala diatas dapat dilihat pada gambar 2. (Aenul M)   

3.    Rotasi

Gambar 3 Hasil Rotasi menggunakan program Processing

            Rotasi dua dimensi pada suatu objek akan memindahkan objek tersebut menurut garis melingkar.

Untuk  melakukan rotasi diperlukan sudut rotasi θ dan pivot point (xp,yp). Nilai positif dari sudut rotasi menentukan arah rotasi berlawanan dengan arah jarum jam. Sedangkan  sudut rotasi negative memutar objek searah dengan jarum jam.

Rotasi suatu titik terhadap pivot point (xp, yp) menggunakan bentuk trigonemetri, sebagai berikut:

x’ = xp + (x – xp) cos θ – (y – yp) sin θ

y’ = yp + (x – xp) sin θ + (y – yp) cos θ

Contoh:

Untuk menggambarkan rotasi suatu objek yang merupakan segitiga dengan koordinat A(10,10), B(30,10), dan C(10,30)  dirotasi dengan sudut rotasi 300, terhadap titik pusat koordinat cartesian (10,10).

Rvektor = (10,10)

Xp=10

Yp=10

Titik A = (10,10)

x’= 10+(10-10) cos 300 – (10-10)sin 300

   = 10+(0) . 0,9 – (0) . 0,5

   = 10

 y’= 10+(10-10)sin 300 + (10-10)cos 300

    = 10+(0) . 0,5 – (0) . 0,9

    = 10

Hasil dari rotasi titik A’= (10,10)

Titik B = (30,10)

x’= 10+(30-10)cos 300 – (10-10)sin 300

= 10+(20) . 0,9 – (0) . 0,5

=28

y’= 10+(30-10)sin 300 + (10-10)cos 300

   = 10+(20) . 0,5 – (0) . 0,9

   = 20

Hasil dari rotasi titik B’= (28,20)

Titik C = (10,30)

x’= 10+(10-10)cos 300 – (30-10)sin 300

= 10+(0) . 0,9 – (20) . 0,5

= 0

y’= 10+(10-10)sin 300 + (30-10)cos 300

   = 10+(0) . 0,5 – (20) . 0,9

   = 28

Hasil dari rotasi titik C’= (0 ,28)

Listing rotasi yang saya gunakan dalam program Processing:

void setup()
{
size(200,200);
background(255);
smooth();
fill(220);
noStroke();
beginShape(TRIANGLES);
vertex(10,10);
vertex(30,10);
vertex(10,30);
stroke(255,0,0);
vertex(10,10);
vertex(28,20);
vertex(0,28);
pushMatrix();
translate(10,10);
rotate(radians(30));
fill(0);
popMatrix();
endShape();
}

Tampilan dari hasil listing rotasi diatas dapat dilihat pada gambar 3. (Dery A)

Demikian pembahasan transformasi 2 dimensi dari kami, semoga bermanfaat 

1.      Aenul Meiser [Content]                  (16.01.071.001)  

2.      Aisyah Nur Fadhilah [Editor]        (16.01.071.007)

3.      Asep Sunarya [Broadcast]              (16.01.071.018)

4.      Dery Apriliansyah [Content]          (16.01.071.020)