Laporan Modul II GRAFIKA

25
LAPORAN MODUL II PRAKTIKUM GRAFIKA KOMPUTER Primitive Objects dan Objek 2 Dimensi Disusun untuk Memenuhi Matakuliah Praktikum Grafika Komputer Yang Dibimbing oleh Bapak Heru Wahyu Herwanto, S.T., M.Kom . OLEH: Putri Rizky Rahmania 130533608286 S1 PTI 2013 OFF A

description

GRAFIKA KOMPUTER

Transcript of Laporan Modul II GRAFIKA

LAPORAN MODUL IIPRAKTIKUM GRAFIKA KOMPUTERPrimitive Objects dan Objek 2 DimensiDisusun untuk Memenuhi Matakuliah Praktikum Grafika KomputerYang Dibimbing oleh Bapak Heru Wahyu Herwanto, S.T., M.Kom

.

OLEH:Putri Rizky Rahmania130533608286S1 PTI 2013 OFF A

UNIVERSITAS NEGERI MALANGFAKULTAS TEKNIKJURUSAN TEKNIK ELEKTROS1 PENDIDIKAN TEKNIK INFORMATIKAFebruari , 2015Modul 2Primitive Objects dan Objek 2 DimensiA. TUJUAN1. Memahami jenis-jenis primitive objects.2. Memahami dan dapat membuat objek primitif.3. Memahami penerapan Objek primitif menjadi bangun 2 dimensi dasar.4. Memahami dan dapat membuat fungsi untuk bangun 2 dimensi dasar.

B. DASAR TEORI1. Sistem Koordinat OpenGL

2. Fungsi gluOrtho2D(left,right,bottom,top) gluOrtho2D(-320,320,-240,240)

3. Fungsi dasar menggambar titik adalah glVe rtex? ()a. glVertex2i (x, y) Menggambar titik pada koordinat x dan y, dengan nilai satuan berupa integer.Contoh glVertex2i (10,10);b. glVertex2f(x,y) Menggambar titik pada koordinat x dan y, dengan nilai satuan berupa float.Contoh glVertex2f (10.0,10.0);c. glVertex2d(x,y) Menggambar titik pada koordinat x dan y, dengan nilai satuan berupa double.Contoh glVertex2d ( 10. 0, 10. 0);

4. Objek primitifa. Titik: GL_POINTSb. Garis: GL_LINESc. Poliline: GL _LINE _STRIPd. Poligon (nofill): GL_LINE_LOOPe. Triangle: GL_TRIANGLESTriangle atau segitiga adalah tiga buah titik yang terhubung menjadi suatu segitiga dengan blok di tengahnya.f. Quads: GL_QUADSQuad atau segiempat adalah empat buah titik yang terhubung menjadi suatu segiempat dengan blok di tengahnya.g. Polygon: GL_POLYGONPolygon merupakan suatu fungsi yang mirip dengan polyline, tetapi menghasilkan kurva tertutup dengan blok warna (fill).h. ColorUntuk memberi warna pada objek, seperti titik atau garis, dapat dilakukan dengan menggunakan fungsi: glColor3f (red, green, blue) ;Di mana red, green, blue berada pada 0 sampai dengan 1, yang menunjukkan skala pencerahan dari masing-masing skala.

C. LATIHANa. PRIMITIVE OBJEK1. Berikut adalah script dasar pada fungsi Main() untuk kegiatan praktikum primitive objek.#include #include void renderScene(void) {/* ... */}void main(int argc, char **argv) {glutInit(&argc, argv);glutInitWindowPosition(100,100);//fungsi main primitive objectsglutInitWindowSize(640,480);//fungsi main primitive objectsgluOrtho2D(-320.0,320.0,-240.0,240.0);//fungsi main primitive objectsglutCreateWindow("Putri Rizky Rahmania");glutDisplayFunc(renderScene);glutMainLoop();}

2. Membuat project baru pada Visual Studio dengan menambahkan fungsi callback untuk glutDisplayFunc(drawDot); .#include #include

void drawDot(void){glClear(GL_COLOR_BUFFER_BIT);glBegin(GL_POINTS);glVertex2i(50,0);glVertex2i(50,50);glVertex2i(0,0);glEnd();glFlush();}void main (int argc, char **argv){glutCreateWindow("Putri Rizky Rahmania");glutInitWindowPosition(100,100);glutInitWindowSize(240,240);gluOrtho2D(-320.,320.,-240.,240.);glutDisplayFunc(drawDot);glutMainLoop();}

Screenshoot :

Penjelasan :Program terdapat tiga buah titik yang dideklarasikan dalam void drawDot(void){ dan menyertakan fungsi glBegin(GL_POINTS); dengan deklarasi koordinatnya yaitu : glVertex2i(50,0); glVertex2i(50,50); glVertex2i(0,0);

3. Buatlah project baru pada Visual Studio menambahkan fungsi glPointSize(int size); untuk mengubah ukuran objek Points.void drawDot(void){glClear(GL_COLOR_BUFFER_BIT);glPointSize(5);glBegin(GL_POINTS);glVertex2i(50,0);glVertex2i(50,50);glVertex2i(0,0);glEnd();glFlush();

}

Screenshoot :

Penjelasan :Program terdapat tiga buah titik koordinat (x,y), titik-titik tersebut didefinisikan oleh gl vertex bertipe integer glVertex2i(50,0); glVertex2i(50,50); glVertex2i(0,0); dan ukuran titik diperbesar dengan . glPointSize(5) ;

4. Membuat project baru pada Visual Studio. Dan menambahkan fungsi callback untuk glutDisplayFunc(drawLine); . void drawLine(){

glBegin(GL_LINES);glVertex2d (0,0);glVertex2d (-2,1);glVertex2d (2,2);glEnd();glFlush();}

Screenshoot :

Penjelasan :glBegin(GL_LINES); Digunakan untuk membentuk garis. Garis diperoleh dari koordinat glVertex2i(0,0); glVertex2i(-2,1); glVertex2i(2,2);

5. Membuat project baru pada Visual Studio . Dan menambahkan fungsi glLineWidth(int size); untuk mengubah ukuran objek Points.void drawLine(){

glLineWidth(10);glBegin(GL_LINES);glVertex2d (0,0);glVertex2d (2,1);glVertex2d (2,2);glEnd();glFlush();}

Screenshoot :

Pejelasan :glBegin(GL_LINES); Digunakan untuk membentuk garis. Garis diperoleh dari koordinat glVertex2i(0,0); glVertex2i(-2,1); glVertex2i(2,2);. Garis diatur ukurannya dengan glLineWidth(10);

6. Membuat project baru pada Visual Studio dengan hasil yang ditampilkan membentuk bangun simetris terbuka.void drawPoliline(){glClear(GL_COLOR_BUFFER_BIT);glBegin(GL_LINE_STRIP);glVertex2i (-50,-50);glVertex2i (50,0);glVertex2i (-50,50);glEnd();glFlush();}

Screenshoot :

Penjelasan :Menggnakan fungsi glBegin(GL_LINE_STRIP); Digunakan untuk membentuk garis strip. Garis ini dibuat membentuk bangun simetris terbuka dengan menentukan titik-titik koordinatnya. Garis diperoleh dari koordinat dengan menggunakan glVertex2i

7. Membuat project baru pada Visual Studio dengan hasil yang ditampilkan membentuk bangun simetris. void drawPoliline(){glClear (GL_COLOR_BUFFER_BIT);glBegin (GL_LINE_LOOP);glVertex2f (50.0,0.0);glVertex2f (50.0,50.0);glVertex2f (0.0,0.0);glVertex2f (0.0,50.0);glEnd();glFlush();}

Screenshoot :

Penjelasan :glBegin(GL_LINE_LOOP); Digunakan untuk membentuk garis loop.

8. Membuat project baru pada Visual Studio dengan hasil yang ditampilkan membentuk 2 segitiga yang terpisah. void drawtriangles(){glBegin(GL_TRIANGLES);glVertex2i(100,150);glVertex2i(100,100);glVertex2i(150,150);

glVertex2i(150,50);glVertex2i(50,100);glVertex2i(-50,-50);

glEnd();glFlush();

}

Screenshoot :

Penjelasan : Program dengan fungsi glBegin(GL_TRIANGLES); Digunakan untuk membentuk segitiga . Triangle di sini dibuat membentuk bangun segitiga terpisah dengan menentukan titik-titik koordinatnya. Segitiga diperoleh dari fungsi koordinat glVertex2i( , );

9. Membuat project baru pada Visual Studio dengan hasil yang ditampilkan membentuk Bangun Bebas. void drawtrianglestrip(){glBegin(GL_TRIANGLE_STRIP);glVertex2i(50,20);glVertex2i(20,20);glVertex2i(0,0);glVertex2i(0,30);glVertex2i(30,30);

glEnd();glFlush();

}

Screenshoot :

Penjelasan :Program dengan fungsi glBegin(GL_TRIANGLE_STRIP); Digunakan untuk membentuk segitiga strip. Triangle strip ini dibuat membentuk bangun bebas, dengan pemanggilan dengan fungsi glutDisplayFunc(drawtrianglestrip);

10. Membuat project baru pada Visual Studio dengan hasil yang ditampilkan membentuk Bangun Bebas. void drawPoliline(){glBegin(GL_TRIANGLE_FAN);glVertex2i(50,20);glVertex2i(20,20);glVertex2i(0,0);glVertex2i(0,30);glVertex2i(30,30);

glEnd();glFlush();

}

Screenshoot :

Penjelasan :Fungsi glBegin(GL_TRIANGLE_FAN); Digunakan untuk membentuk segitiga strip. Triangle fan ini dibuat membentuk bangun bebas dengan diperoleh dari koordinat : glVertex2i(50,20); glVertex2i(20,20); glVertex2i(0,0); glVertex2i(0,30); glVertex2i(30,30); 11. Membuat project baru pada Visual Studio dengan hasil yang ditampilkan membentuk 2 Bangun Segi Empat Terpisah.void drawPoliline(){glBegin(GL_QUADS);glVertex2i(150,150);glVertex2i(100,150);glVertex2i(100,100);glVertex2i(150,100);glVertex2i(200,150);glVertex2i(260,150);glVertex2i(260,100);glVertex2i(200,100);

glEnd();glFlush();

}

Screenshoot :

Penjelasan :glBegin(GL_QUADS); Digunakan untuk membentuk persegi. Quads ini dibuat untuk membentuk 2 bangun segi empat terpisah dengan menentukan titik-titik koordinatnya.

12. Membuat project baru pada Visual Studio dengan hasil yang ditampilkan membentuk Bangun Bebas. void drawPoliline(){glBegin(GL_QUAD_STRIP);glVertex2i(50,0);glVertex2i(50,50);glVertex2i(0,0);glVertex2i(0,50);glVertex2i(-50,-50);glVertex2i(0,-50);glVertex2i(-50,-50);

glEnd();glFlush();

}

Screenshoot :

Penjelasan :Fungsi glBegin(GL_QUADS_STRIP); Digunakan untuk membentuk persegi. Quads strip ini dibuat untuk membentuk bangun bebas.

13. Buatlah project baru pada Visual Studio dengan nama prak1-Poligon. Buatlah agar hasil yang ditampilkan membentuk Bangun Bebas. Sajikan screenshotnya. Dan jelaskan proses rendering vertexnya.void drawPoliline(){

glBegin(GL_POLYGON);glVertex2i(100,0);glVertex2i(100,100);glVertex2i(0,0);glVertex2i(0,100);glVertex2i(-75,-75);glVertex2i(0,-75);glVertex2i(-75,-75);

glEnd();glFlush();

}

Screenshoot :

Penjelasan :Program di atas dengan fungsi glBegin(GL_POLYGON); Digunakan untuk membentuk polygon. gl_poligon ini dibuat untuk membentuk bangun bebas.b. OBJEK 2D1. Membuat project baru pada Visual Studio. Dengan tampilan obyek 2 dimensi berbentuk persegi panjang seperti di bawah ini, gunakan primitif dan struktur vertex yang paling efisien, hasilnya berupa screenshot yang berupa tampilan 3 bangun dengan posisi, dimensi, dan warna yang berbeda.#include #include

void segiEmpat (int posx, int posy, int w, int h) { glBegin(GL_QUADS); glVertex2i(posx, posy); glVertex2i(w+posx, posy); glVertex2i(w+posx, posy-h); glVertex2i(posx, posy-h); glEnd();}

void renderScene (void) {

glClear(GL_COLOR_BUFFER_BIT); glLineWidth(10); glColor3f(1.,0.,0.); segiEmpat(-200,200,100,100); glColor3f(0.,1.,0.); segiEmpat(100,200,150,150); glColor3f(0.,0.,1.); segiEmpat(0,0,50,50); glFlush();}

void main(int argc, char **argv){glutInit(&argc, argv);glutInitWindowPosition(100,100);glutInitWindowSize(240,240);glutCreateWindow("Putri Rizky Rahmania");gluOrtho2D(-320,320,-240,240);glutDisplayFunc(renderScene);glutMainLoop();}

Screenshoot :

Penjelasan :Fungsi persegi panjang mendefinisikan rumus persegi panjang menggunakan glBegin(GL_QUADS);. Tiap glvertex menentukan posisi x dan y :glVertex2i(posx, posy);glVertex2i(w+posx, posy); glVertex2i(w+posx, posy-h); glVertex2i(posx, posy-h);Fungsi renderScene mendefinisikan titik koordinat pada yang ada di fungsi trapesium sama kaki serta mendefinisikan color yang akan digunakan.

2. Membuat project baru pada Visual Studio. Dengan tampilan obyek 2 dimensi trapesium , gunakan primitif dan struktur vertex yang paling efisien, hasilnya berupa screenshot yang berupa tampilan 3 bangun dengan posisi, dimensi, dan warna yang berbeda.#include #include

void trapesium (int posx,int posy,int s,int i,int h){//Fungsi trapesium menggunakan triangle fan . Tiap glvertex menentukan posisi x dan y.glBegin(GL_TRIANGLE_FAN);glVertex2i(posx,posy);glVertex2i(posx+s,posy);glVertex2i(posx+i,posy-h);glVertex2i(posx,posy-h);glEnd();}

/*fungsi renderScene mendefinisikan titik koordinat dan mendefinisikan color yang akan digunakan.*/void renderScene(void){glClear(GL_COLOR_BUFFER_BIT);glColor3f(2.,2.,0.);trapesium(-50,300,40,120,50);glColor3f(1,0,0);trapesium(-50,-130,90,130,50);glColor3f(1,1,1);trapesium(-50,100,50,150,50);glFlush();}

void main(int argc, char **argv){glutInit(&argc, argv);glutInitWindowPosition(100,100);glutInitWindowSize(640,480);glutCreateWindow("Putri Rizky Rahmania");gluOrtho2D(-320,320,-320,320);glutDisplayFunc(renderScene);glutMainLoop();}

Screenshot:

Penjelasan :Program di atas menggunakan fungsi glBegin(GL_TRIANGLE_FAN); yaitu untuk menghubungkan titik koordinat yang akan membentuk segitiga fan secara kasarnya.

3. Membuat project baru pada Visual Studio. Dengan tampilan obyek 2 dimensi berbentuk trapesium sama kaki , gunakan primitif dan struktur vertex yang paling efisien, hasilnya berupa screenshot yang berupa tampilan 3 bangun dengan posisi, dimensi, dan warna yang berbeda.#include #include

void trapesiumsamakaki (int posx,int posy,int s,int i,int h){glBegin(GL_TRIANGLES);glVertex2i(posx,posy);glVertex2i(posx+s,posy);glVertex2i(posx+s+(i-s/2),posy-h);glVertex2i(posx+s+(i-s/2),posy-h);glVertex2i(posx,posy);glVertex2i(posx-(i-s/2),posy-h);glEnd();}

void renderScene(void){glClear(GL_COLOR_BUFFER_BIT);

glColor3f(1.,0.,0.);trapesiumsamakaki(-10,-10,100,80,100);glColor3f(0.,1.,0.);trapesiumsamakaki(-100,-80,150,100,100);glColor3f(0.,0,1.);trapesiumsamakaki(-80,-150,80,120,100);glFlush();}

void main(int argc, char **argv){glutInit(&argc, argv);glutInitWindowPosition(100,100);glutInitWindowSize(240,240);glutCreateWindow("Putri Rizky R");gluOrtho2D(-320,320,-320,320);glutDisplayFunc(renderScene);glutMainLoop();}

Screenshot:

Penjelasan :Program membuat trapezium sama kaki dengan menggunakan fungsi glBegin(GL_TRIANGLES); kemudian dengan void renderscene untuk fungsi memanggil/menampilkan yang di dalamnya ada fungsi titik koordinat dan pemberian warna.

4. Membuat project baru pada Visual Studio. Dengan tampilan obyek 2 dimensi berbentuk jajar genjang , gunakan primitif dan struktur vertex yang paling efisien, hasilnya berupa screenshot yang berupa tampilan 3 bangun dengan posisi, dimensi, dan warna yang berbeda.#include #include

void genjang(float posx, float posy, float w, float h){ glBegin(GL_QUADS); glVertex2f (posx,posy); glVertex2f (posx+(0.67*w), posy); glVertex2f (posx+w, posy+(0.5*h)); glVertex2f (posx+(0.33*w), posy+(0.5*h)); glEnd();}

void renderScene (void) {glClear(GL_COLOR_BUFFER_BIT);glLineWidth(10);glColor3f(2.,2.,0.);genjang(80,75,100,105); glColor3f(1.,0.,0.);genjang(100,200,100,150); glColor3f(1.,1.,1.);genjang(150,50,45,75); glFlush();}

void main(int argc, char **argv){glutInit(&argc, argv);glutInitWindowPosition(100,100);glutInitWindowSize(240,240);glutCreateWindow("Putri Rizky R");gluOrtho2D(-300,300,-300,300);glutDisplayFunc(renderScene);glutMainLoop();

}

Screenshot:

Penjelasan :Program membuat trapezium sama kaki dengan menggunakan fungsi glBegin(GL_GUADS); untuk membuat gambar sejenis segiempat, jajar genjang dll.

D. TUGAS ASISTENSI

1. Membuat sebuah fungsi untuk membuat tampilan objek 2 dimensi berbentuk belah ketupat menggunakan primitif dan struktur vertex yang paling efisien, tampilan 3 bangun dengan posisi, dimensi, dan warna yang berbeda.#include #include #include //header aritmatik

void BelahKetupat (int posx, int posy, int s){int w = s*cos(45*3.14/180)/2;glBegin(GL_POLYGON);

glVertex2i (w+posx,posy);glVertex2i (2*w+posx,posy-w);glVertex2i (w+posx,posy-2*w);glVertex2i (posx,posy-w);

glEnd();glFlush();}

void renderScene (void){glClear(GL_COLOR_BUFFER_BIT);/* ....*/glColor3f(1,1,0.5);BelahKetupat(-150,90,200);glColor3f(0,0.5,0.2);BelahKetupat(0,-100,100);glColor3f(1,0.75,0.5);BelahKetupat(100,100,200);}

void main (int argc, char **argv) {glutInit (&argc, argv);/* ... */glutInitDisplayMode (GLUT_DEPTH | GLUT_SINGLE | GLUT_RGBA);glutInitWindowPosition(100,100);glutInitWindowSize(320,240);glutCreateWindow("Putri Rizky R");gluOrtho2D(-320.,320.,-240.,240.);glutDisplayFunc(renderScene);glutMainLoop();}

Screenshot :Penjelasan :Program di atas menampilkan belah ketupat pertama dengan deklarasi fungsi belah ketupat dengan memberi fungsi rumus dari belahketupat , kemudian kita menggunakan fungsi renderScene yang di dalamnya ada fungsi untuk membuat warna dan letak belah ketupat (titik-titik koordinat)

2. Membuat sebuah fungsi untuk membuat tampilan objek 2 dimensi berbentuk layang-layang seperti di bawah ini, menggunakan primitif dan struktur vertex yang paling efisien, tampilan berupa 3 bangun dengan posisi, dimensi, dan warna yang berbeda.#include #include

void layang(int posx,int posy,int w,int h){glBegin(GL_POLYGON);glVertex2i(posx,posy);glVertex2i(posx+(w/2),posy-(h/2));glVertex2i(posx,posy-h-(h/2));glVertex2i(posx-(w/2),posy-(h/2));glEnd();}

void renderScene(void){glClear(GL_COLOR_BUFFER_BIT);glColor3f(1,0.5,0.5);layang (-200,200,200,300);glColor3f(1.,1.,0.);layang (20,-80,70,150);glColor3f(0,1,1);layang (100,100,150,200);glFlush();}

void main(int argc, char **argv){glutInit(&argc, argv);glutInitWindowPosition(200,200); //ukuran windowglutInitWindowSize(540,380); //posisi windowglutCreateWindow("Putri Rizky R");gluOrtho2D(-300,300,-300,300); // koordinat windowglutDisplayFunc(renderScene); // memanggil fungsi renderSceneglutMainLoop();}

Screenshot :

Penjelasan :Program di atas membat bentuk laying-layang dengan mendeklarasikan fungsi void layang(int posx,int posy,int w,int h){, dengan glBegin(GL_POLYGON); karena akan membuat objek yang berasal dari hubungan antar titik koordinat

3. Membuat Fungsi untuk lingkaran dengan menentukan struktur vertex dan paramater yang digunakan dalam fungsinya.#include #include #include

//fungsi untuk membuat lingkaranvoid Lingkaran (int posx, int posy, int jari_jari){glBegin(GL_POLYGON);//rumus untuk menempatkan vertex agar membentuk sebuah lingkaranfor (int i=0;i