Grafika Komputer ( translasi, rotasi dan skala )

     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. Contoh transformasi geometri adalah translasi, penskalaan, putaran (rotasi), balikan. Transformasi ini dikenal dengan transformasi affine. 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.

1.  Translasi 

     Translasi merupakan suatu operasi yang menyebabkan perpindahan objek 2D dari satu tempat ke tempat yang lain. Perubahan ini berlaku dalam arah yang sejajar dengan sumbu X dan sumbu Y. Translasi dilakukan dengan penambahan translasi pada suatu titik koordinat dengan translation vector, yaitu (tx,ty), dimana tx adalah translasi menurut sumbu x dan ty adalah translasi menurut sumbu y. Koorinat baru titik yang ditranslasi dapat diperoleh dengan menggunakan rumus : 

x‟ = x + tx (x,y) = titik asal sebelum translasi 

y„= y + ty (x‟,y‟) = titik baru hasil translasi 

     translasi adalah transformasi dengan bentuk yang tetap, memindahkan objek apa adanya. Setiap titik dari objek akan ditranslasikan dengan besaran yang sama. Dalam operasi translasi, setiap titik pada suatu entitas yang ditranslasi bergerak dalam jarak yang sama. Pergerakan tersebut dapat berlaku dalam arah sumbu X saja, atau dalam arah sumbu Y saja atau keduanya. Translasi juga berlaku pada garis, objek atau gabungan objek 2D yang lain. Untuk hal ini, setiap titik pada garis atau objek yang ditranslasi dalam arah x dan y masing-masing sebesar tx,ty. 

Contoh :

Untuk menggambarkan translasi suatu objek berupa segitiga dengan koordinat A(10,10) B(30,10) dan C(10,30) dengan tx,ty(10,20), tentukan koordinat yang barunya ? 

Jawab :

A : x’=10+10=20 

                         y’=10+20=30 

                        A‟=(20,30) 

B : x’=30+10=40
                        y’=10+20=30
                       B‟=(40,30)
C : x’=10+10=20
                       y’=30+20=50
                      C‟=(20,50)

2.  Penskalaan
     Penskalaan adalah suatu operasi yang membuat suatu objek berubah ukurannya baik menjadi mengecil ataupun membesar secara seragam atau tidak seragam tergantung pada faktor penskalaan (scalling factor) yaitu (sx,sy) yang diberikan. sx adalah faktor penskalaan menurut sumbu x dan sy faktor penskalaan menurut sumbu y. Koordinat baru diperoleh dengan

x‟ = x + sx (x,y) = titik asal sebelum diskala 

y„= y + sy (x‟,y‟) = titik setelah diskala 

Nilai lebih dari 1 menyebabkan objek diperbesar, sebaliknya bila nilai lebih kecil dari 1, maka objek akan diperkecil. Bila (sx,sy) mempunyai nilai yang sama, maka skala disebut dengan uniform scalling. 

Contoh :

Untuk menggambarkan skala suatu objek berupa segitiga dengan koordinat A(10,10) B(30,10) dan C(10,30) dengan (sx,sy) (3,2), tentukan koordinat yang barunya ?

 Jawab :

 A                : x‟=10*3=30 

                     y‟=10*2=20 

                    A‟=(30,20) 

B                : x‟=30*3=90 

                    y‟=10*2=20 

                   B‟=(90,20) 

C               : x‟=10*3=30 

                   y‟=30*2=60 

                  C‟=(30,60)

3.  Perputaran (Rotasi)
     Putaran adalah suatu operasi yang menyebabkan objek bergerak berputar pada titik pusat atau pada sumbu putar yang dipilih berdasarkan sudut putaran tertentu. Untu melakukan rotasi diperlukan sudut rotasi dan pivot point (xp,yp) dimana objek akan dirotasi. 

     Putaran biasa dilakukan pada satu titik terhadap sesuatu sumbu tertentu misalnya sumbu x, sumbu y atau garis tertentu yang sejajar dengan sembarang sumbu tersebut. Titik acuan putaran dapat sembarang baik di titik pusat atau pada titik yang lain. 

    Aturan dalam geometri, jika putaran dilakukan searah jarum jam, maka nilai sudutnya adalah negatif. Sebaliknya, jika dilakukan berlawanan arah dengan arah jarum jam nilai sudutnya adalah positif. 

    Rotasi dapat dinyatakan dengan : 

x‟=r cos(Ø+0) = r cos Ø cos 0 - r sin Ø sin  0

y‟=r sin (Ø+0) = r soc Ø sin  0 + r sin Ø cos 0

sedangkan di ketahui 

x= r cos Ø, y = r sin Ø

 lakukan subtitusi, maka : 

x‟=x cos 0 - y sin 0

y‟=x sin  0 + y cos 0

Contoh :

Untuk menggambarkan rotasi suatu objek berupa segitiga dengan koordinat A(10,10), B(30,10) dan C(10,30) dengan sudut rotasi 30o terhadap titik pusat cartesian (10,10), dilakukan dengan menghitung koordinat hasil rotasi tiap titik satu demi satu. 

Jawab : 
Titik A
                            x‟= xp+(x - xp) cos 0 - (y - yp) sin 0
                               =10+(10-10)*0.9 – (10-10)*0.5 = 10
                            y‟= yp+(x - xp) sin 0 + (y - yp) cos 0
                               = 10+(10-10)*0.5 – (10-10)*0.9 = 10
                            Titik A‟(10,10)

Titik B
                           x‟= xp+(x - xp) cos 0 - (y - yp) sin 0
                              =10+(30-10)*0.9 – (10-10)*0.5 = 28
                          y‟= yp+(x - xp) sin 0 + (y - yp) cos 0
                             = 10+(30-10)*0.5 – (10-10)*0.9 = 20
                         Titik B‟(28,20)

Titik C
                          x‟= xp+(x - xp) cos 0- (y - yp) sin 0
                             =10+(10-10)*0.9 – (30-10)*0.5 = 0
                         y‟= yp+(x - xp) sin 0 + (y - yp) cos 0
                            = 10+(10-10)*0.5 – (30-10)*0.9 = 28
                        Titik A‟(0,28)

Contoh script programnya :

//-----------------------------------------------------//
#include (vcl.h)
#include (math.h)
#pragma hdrstop

#include "Unit1.h"
//-----------------------------------------------------//
#pragma package(smart_init)
#pragma resource "*.dfm"
TForm1 *Form1;
struct Elemen { float x,y ;} ;
Elemen Objek[6];

//-----------------------------------------------------//
__fastcall TForm1::TForm1(TComponent* Owner)
: TForm(Owner)
{
}
//-----------------------------------------------------//

void __fastcall TForm1::FormShow(TObject *Sender)
{ int i;
Image1->Canvas->Rectangle(0,0,Image1->Width,Image1->Height);
Image1->Canvas->MoveTo(Objek[5].x,Objek[5].y);
for (i=1;i<=5;i++){ Image1->Canvas->LineTo(Objek[i].x,Objek[i].y);};
}
//-----------------------------------------------------//

void __fastcall TForm1::FormActivate(TObject *Sender)
{
Objek[1].x = 100; Objek[1].y = 50;
Objek[2].x = 50; Objek[2].y = 100;
Objek[3].x = 100; Objek[3].y = 100;
Objek[4].x = 100; Objek[4].y = 150;
Objek[5].x = 150; Objek[5].y = 100;
FormShow(Sender);
}
//-----------------------------------------------------//

void __fastcall TForm1::ButtonKiriClick(TObject *Sender)
{ int i;
for (i=1;i<=5;i++){ Objek[i].x-=5;};
FormShow(Sender);
}
//-----------------------------------------------------//

void __fastcall TForm1::ButtonAtasClick(TObject *Sender)
{
int i;
for (i=1;i<=5;i++){ Objek[i].y-=5;};
FormShow(Sender);
}
//-----------------------------------------------------//

void __fastcall TForm1::ButtonKananClick(TObject *Sender)
{ int i;
for (i=1;i<=5;i++){ Objek[i].x+=5;};
FormShow(Sender);
}
//-----------------------------------------------------//

void __fastcall TForm1::ButtonBawahClick(TObject *Sender)
{
int i;
for (i=1;i<=5;i++){ Objek[i].y+=5;};
FormShow(Sender);
}
//-----------------------------------------------------//

void __fastcall TForm1::Button1Click(TObject *Sender)
{ Elemen TempObjek[6];
int i; float Sdt;
for (i=1;i<=5;i++)
{
Objek[i].x=Objek[i].x-Image1->Width / 2;
Objek[i].y=Objek[i].y-Image1->Height / 2;
Sdt=10*M_PI/180;
TempObjek[i].x=(Objek[i].x*cos(Sdt)-Objek[i].y*sin(Sdt)); TempObjek[i].y=(Objek[i].x*sin(Sdt)+Objek[i].y*cos(Sdt));
Objek[i]=TempObjek[i];
Objek[i].x=Objek[i].x+Image1->Width / 2;
Objek[i].y=Objek[i].y+Image1->Height / 2;
}
FormShow(Sender);
}
//-----------------------------------------------------//

void __fastcall TForm1::Button2Click(TObject *Sender)
{ Elemen TempObjek[6];
int i,n,m; float Sdt;
for (i=1;i<=5;i++)
{
n = Objek[3].x;
m = Objek[3].y;
Objek[i].x=Objek[i].x-n;
Objek[i].y=Objek[i].y-m;
Sdt=10*M_PI/180;
TempObjek[i].x=(Objek[i].x*cos(Sdt)-Objek[i].y*sin(Sdt)); TempObjek[i].y=(Objek[i].x*sin(Sdt)+Objek[i].y*cos(Sdt));
Objek[i]=TempObjek[i];
Objek[i].x=Objek[i].x+n;
Objek[i].y=Objek[i].y+m;
}
FormShow(Sender);
}
//-----------------------------------------------------//

Setelah mengetikkan script tersebut, outputnya sebagai berikut :