Laporan grafika

21
A. HALAMAN INTI a. GLUT (OpenGL Utility Toolkit) Dikembangkan oleh Mark Kilgard. GLUT merupakan pengembangan dari OpenGL dimana memiliki keunggulan sebagai berikut: Mudah, portable window manager, menggunakan callback functions untuk menambahkan interaksi dari user. Didesain untuk aplikasi dengan level kecil hingga menengah. Distribusi library bebas tetapi tidak open source. b. Pemrograman berbasis event GLUT pada dasarnya dibangun untuk menciptakan aplikasi grafis menggunakan pemrograman yang bersifat prosedural. Di dalamnya terdapat fungsi main loop yang diatur oleh GLUT dan looping yang terjadi dalam aplikasi bertujuan untuk penanganan fungsi-fungsi callback sebagai input dari user seperti fungsi redraw, mouse, keyboard, joystick, dll. c. Instalasi GLUT pada windows dan aplikasi pengembangan Visual Studio GLUT tidak secara otomatis dapat diaplikasikan karena membutuhkan beberapa file tambahan antara lain glut.h, glut32.lib, glut32.dll yang harus disimpan pada lokasi tertentu sesuai dengan aplikasi pengembangan yaitu Visual Studio.

Transcript of Laporan grafika

A. HALAMAN INTI

a. GLUT (OpenGL Utility Toolkit)

Dikembangkan oleh Mark Kilgard. GLUT merupakan

pengembangan dari OpenGL dimana memiliki keunggulan

sebagai berikut:

Mudah, portable window manager, menggunakan callback

functions untuk menambahkan interaksi dari user.

Didesain untuk aplikasi dengan level kecil hingga

menengah.

Distribusi library bebas tetapi tidak open source.

b. Pemrograman berbasis event

GLUT pada dasarnya dibangun untuk menciptakan aplikasi

grafis menggunakan pemrograman yang bersifat prosedural.

Di dalamnya terdapat fungsi main loop yang diatur oleh

GLUT dan looping yang terjadi dalam aplikasi bertujuan

untuk penanganan fungsi-fungsi callback sebagai input

dari user seperti fungsi redraw, mouse, keyboard,

joystick, dll.

c. Instalasi GLUT pada windows dan aplikasi pengembangan

Visual Studio

GLUT tidak secara otomatis dapat diaplikasikan karena

membutuhkan beberapa file tambahan antara lain glut.h,

glut32.lib, glut32.dll yang harus disimpan pada lokasi

tertentu sesuai dengan aplikasi pengembangan yaitu Visual

Studio.

B. JOBSHEET PRAKTIKUM

a. Setting project baru

- Buka aplikasi visual studio

- Buat project baru dengan pilih menu File New

Project. Kemudian pilih template Win32 Console

Application pada Visual C++. dan jangan lupa berinama

file.

- Pada tampilan wizard Win32 Application pilih Application Setting dan beri tanda centang kotak dialogEmpty project Finish.

- Klik kanan pada project di form, pilih Add New Item.Kemudian Pilih file CPP dan beri nama sbg berikut :

- Langkah selanjutnya adalah menambah library OpenGL dengan cara klik kanan file .cpp properties. Dan pilih folder include openGL pada directory komputer.

- Buat script seperti dibawah ini.

Source Code:

Screenshoot:

b. Jobsheet Praktikum

1. Pada fungsi main terdapat statement

glutDisplayFunc(renderScene); hilangkan atau jadikan

pernyataan tersebut menjadi comment. Apa yang

terjadi? Mengapa?

Source Code:#include <stdlib.h>#include <glut.h>

void renderScene(void){

}void main ( int argc, char **argv) {

glutInit (&argc, argv);glutInitDisplayMode(GLUT_DEPTH | GLUT_SINGLE | GLUT_RGBA);glutInitWindowPosition (100,100);glutInitWindowSize(320,320);glutCreateWindow("GLUT : Nur Amalianda_segitiga");

glutMainLoop();} Penjelasan:

Pada program di atas tidak dapat menampilkan output

karena fungsi glutDisplayFunc(renderScene); adalah

sebagai memanggil kembali objek atau menampilkan

objek tersebut .

2. Cantumkan kembali fungsi

glutDisplayFunc(renderScene); Ubah-ubahlah parameter

pada fungsi glutInitWindowPosition(), Bagaimana

sistem koordinat yang diterapkan bagi window

aplikasi? (gambarkan sistem koordinatnya)

Source Code:#include <stdlib.h>#include <glut.h>

void renderScene(void){

}void main ( int argc, char **argv) {

glutInit (&argc, argv);glutInitDisplayMode(GLUT_DEPTH | GLUT_SINGLE | GLUT_RGBA);glutInitWindowPosition (250,250);glutInitWindowSize(320,320);glutCreateWindow("GLUT : Nur Amalianda_segitiga");

glutDisplayFunc(renderScene); glutMainLoop();

}

Screenshoot:

Penjelasan:

Disini saya menggunakan windows position 250, 250 .

maka posisi yang akan di tampilkan pada layer laptop

adalah di titik kooordinatnya 250 x 250 pada laptop

anda

3. Pada program dan tambahkan program di bawah ini ke

dalam fungsi renderScene.

Gambarkan sistem koordinat dan titik-titik

koordinatnya yang diterapkan untuk

menghasilkan segitiga tersebut !

Source Code:#include <stdlib.h>#include <glut.h>

void renderScene(void){glClear(GL_COLOR_BUFFER_BIT);glBegin(GL_TRIANGLES);glVertex3f(-0.5,-0.5,0.0);//AglVertex3f(0.5,0.0,0.0);//BglVertex3f(0.0,0.5,0.0);//C

glEnd();glFlush();

}void main(int argc, char **argv){

glutInit(&argc, argv);glutInitDisplayMode(GLUT_DEPTH|GLUT_SINGLE|GLUT_RGBA);glutInitWindowPosition(100,100);glutInitWindowSize(320,320);

glutCreateWindow("GLUT : Nur Amalianda");glutDisplayFunc(renderScene);glutMainLoop();

}

Screenshoot:

Penjelasan:

0.5 0.10-0.5

-0.10

-0.5-0.10

0.5

0.10

Dari gambar di atas sangat jelas terlihat titik –

titik yang dapat menghubungkan sehingga menjadi

sebuah segitiga.

4. Buatlah agar segitiga menjadi segitiga siku-siku dan

terletak pada posisi kiri atas, kanan atas, kiri

bawah, kanan bawah, dan tepat di tengah, dengan

mengubah parameter pada fungsi glVertex3f(a, b, c).

Sajikan screenshot eksekusi program.

Source Code:#include <stdlib.h>#include <glut.h>

void renderScene(void){glClear(GL_COLOR_BUFFER_BIT);glBegin(GL_TRIANGLES);//pojok kiri atasglVertex3f(-30.,50.,0.0);glVertex3f(-50.,50.,0.0);glVertex3f(-50.,20.,0.0);//pojok kanan atasglVertex3f(30.,50.,0.0);glVertex3f(50.,50.,0.0);glVertex3f(50.,20.,0.0);//pojok kanan bawahglVertex3f(30.,-50.,0.0);glVertex3f(50.,-50.,0.0);glVertex3f(50.,-20.,0.0);//pojok kiri bawahglVertex3f(-30.,-50.,0.0);glVertex3f(-50.,-50.,0.0);glVertex3f(-50.,-20.,0.0);//tengahglVertex3f(7.,0.0,0.0);glVertex3f(-7.,7.,0.0);glVertex3f(-7.,0.0,0.0);glEnd();glFlush();

}void main(int argc, char **argv){

glutInit(&argc, argv);

glutInitDisplayMode(GLUT_DEPTH|GLUT_SINGLE|GLUT_RGBA);

glutInitWindowPosition(100,100);glutInitWindowSize(320,320);

glutCreateWindow("GLUT : Nur Amalianda");gluOrtho2D(-50.0,50.0,-50.0,50.0);glutDisplayFunc(renderScene);glutMainLoop();

}

Screenshoot:

Penjelasan:

Dalam program ini kia dapat menentukan besar titik

koordinat yang akan di capai dengan menggunakan

gluOrtho2D(-50.0,50.0,-50.0,50.0); , sehingga batas dari

canvas di layar adalah (-50.0,50.0,-50.0,50.0).

5. Dari program (d) ubahlah dimensi window aplikasi

menjadi 640 x 640 (w x h). Sajikan screenshotnya.

Bandingkan dengan ukuran window yang sebelumnya dan

beri kesimpulan.

Source Code:

30

30

-30

50

50

-50

50

-7

-7 7

7

#include <stdlib.h>#include <glut.h>

void renderScene(void){glClear(GL_COLOR_BUFFER_BIT);glBegin(GL_TRIANGLES);//pojok kiri atasglVertex3f(-30.,50.,0.0);glVertex3f(-50.,50.,0.0);glVertex3f(-50.,20.,0.0);//pojok kanan atasglVertex3f(30.,50.,0.0);glVertex3f(50.,50.,0.0);glVertex3f(50.,20.,0.0);//pojok kanan bawahglVertex3f(30.,-50.,0.0);glVertex3f(50.,-50.,0.0);glVertex3f(50.,-20.,0.0);//pojok kiri bawahglVertex3f(-30.,-50.,0.0);glVertex3f(-50.,-50.,0.0);glVertex3f(-50.,-20.,0.0);//tengahglVertex3f(7.,0.0,0.0);glVertex3f(-7.,7.,0.0);glVertex3f(-7.,0.0,0.0);glEnd();glFlush();

}void main(int argc, char **argv){

glutInit(&argc, argv);

glutInitDisplayMode(GLUT_DEPTH|GLUT_SINGLE|GLUT_RGBA);glutInitWindowPosition(100,100);glutInitWindowSize(640,640);

glutCreateWindow("GLUT : Nur Amalianda");gluOrtho2D(-50.0,50.0,-50.0,50.0);glutDisplayFunc(renderScene);glutMainLoop();

}

Screenshoot:

Penjelasan:

Program ini sama dengan program sebelumnya Cuma

mengganti besar sizenya menjadi 640x640 dan hasilnya

adalah ukuran layar tampilan output objek terlihat

besar dari sebelumnya.

6. Ubahlah program menjadi seperti di bawah ini.

(tambahan tampak pada tanda). Ubahlah nilainilai

parameter pada glVertex3f(a, b, c); dari bernilai 10

dan -10 menjadi nilai maksima 50 dan -50. Sajikan

screeshot-nya dan buatlah kesimpulan yang

berhubungan dengan fungsi

gluOrtho2D(left,right,bottom,top).

Source Code:#include <stdlib.h>#include <glut.h>

void renderScene(void){glClear (GL_COLOR_BUFFER_BIT);glBegin(GL_TRIANGLES);

glVertex3f(-10.,10.,0.0);glVertex3f(-10.0,0.0,0.0);glVertex3f(0.0,0.0,0.0);

glEnd();glFlush();

}

void main ( int argc, char **argv) {glutInit (&argc, argv);glutInitDisplayMode(GLUT_DEPTH | GLUT_SINGLE | GLUT_RGBA);glutInitWindowPosition (100,100);glutInitWindowSize(320,320);

glutCreateWindow("By : Nur Amalianda");gluOrtho2D(-50.0,50.0,-50.0,50.0);glutDisplayFunc(renderScene); glutMainLoop();

}

Screenshoot:

Penjelasan:

Dalam program ini segitiga siku – siku di tengah terlihat kecil karena dalam program ini gluOrtho2D yang di gunakan adalah (-50.0,50.0,-50.0,50.0); sedangkantitik koordinat dari segitiga adalah (0.0 ,10.0, -10.0). jadi terlihat kecil.

C. TUGAS ASISTENSI

Buatlah sebuah aplikasi yang menampilkan segitiga

siku-siku, segitiga sembarang, sama kaki, dan sama

sisi dengan koordinat yang berbeda. Dan window

aplikasi berukuran :

panjang = 3 digit NIM

lebar = 3 digit NIM

judul window = Nama lengkap

1. Segitiga siku-siku

Source Code:

#include <stdlib.h>#include <glut.h>

void renderScene(void){glClear (GL_COLOR_BUFFER_BIT);glBegin(GL_TRIANGLES);glColor3f(0,1,0);glVertex2f(-0.5, -0.5); glVertex2f(0.5, -0.5); glVertex2f(0.5, 0.5);glEnd();glFlush();

}void main ( int argc, char **argv) {

glutInit (&argc, argv);glutInitDisplayMode(GLUT_DEPTH | GLUT_SINGLE | GLUT_RGBA);glutInitWindowPosition (100,100);glutInitWindowSize(100,100);glutCreateWindow("Nur Amalianda");

glutDisplayFunc(renderScene); glutMainLoop();

}

Screenshoot:

Penjelasan:

Dalam program ini dapat di jelaskan cara membuat segitiga siku-siku dengan pemanggilan GL_TRIANGLES dimana dengan ukuran window sizenya ada 3 angka di belakang nim kita, disini saya tidak menggunakan gluOrtho, tetapi tetap bisa karena layar atau canvastersebut dapat menyesuaikan dengan titik koordinat yang kita tetapkan. Disini saya juga menggunakan warna hijau sebagai warna untuk objek glColor3f(0,1,0);

2. Segitiga sembarang

Source Code:

#include <windows.h>#include <gl\gl.h>#include <gl\glut.h>

void init(void);void display(void);void keyboard(unsigned char, int, int);

int main (int argc, char **argv){

glutInit(&argc, argv);glutInitDisplayMode(GLUT_DOUBLE | GLUT_RGB);glutInitWindowSize(100, 100);glutInitWindowPosition(100, 100);glutCreateWindow("Nur Amalianda");init();glutDisplayFunc(display);

glutMainLoop();return 0;

}

void init(void){

glClearColor(0.0, 0.0, 0.0, 0.0);glMatrixMode(GL_PROJECTION);glLoadIdentity();glOrtho(-15.0, 15.0, -15.0, 15.0, -15.0, 15.0);

}

void display(void){

glBegin(GL_TRIANGLES);glColor3f(0,1,0);

glVertex3f(0.0, -6.0, 0.0);glVertex3f(6.0, 4.0, 0.0);glVertex3f(4.0, -6.0, 0.0);

glEnd();glutSwapBuffers();

}

Screenshoot:

Penjelasan :Dalam program ini dapat di jelaskan cara membuat segitiga sembarang dengan pemanggilan GL_TRIANGLES dimana dengan ukuran window sizenya ada 3 angka di belakang nim kita, gluOrtho disni masing-masing sisiberukuran 15, jadi titik koordinat objek tidak bolehmelebihi itu. Disini saya juga menggunakan warna hijau sebagai warna untuk objek glColor3f(0,1,0);

3. Segitiga sama kaki

Source Code:

#include <windows.h>#include <gl\gl.h>#include <gl\glut.h>

void init(void);void display(void);void keyboard(unsigned char, int, int);

int main (int argc, char **argv){

glutInit(&argc, argv);glutInitDisplayMode(GLUT_DOUBLE | GLUT_RGB);glutInitWindowSize(100, 100);glutInitWindowPosition(100, 100);glutCreateWindow("Nur Amalianda");init();glutDisplayFunc(display);

glutMainLoop();return 0;

}

void init(void)

{glClearColor(0.0, 0.0, 0.0, 0.0);glMatrixMode(GL_PROJECTION);glLoadIdentity();glOrtho(-15.0, 15.0, -15.0, 15.0, -15.0, 15.0);

}

void display(void){

glBegin(GL_TRIANGLES);glColor3f(0,1,0);

glVertex3f(-7.5, 0.0, 0.0);glVertex3f(4.0, 4.0, 0.0);glVertex3f(4.0, -4.0, 0.0);

glEnd();glutSwapBuffers();

}

Screenshoot:

Penjelasan :

Dalam program ini dapat di jelaskan cara membuat

segitiga sama kaki dengan pemanggilan GL_TRIANGLES

dimana dengan ukuran window sizenya ada 3 angka di

belakang nim kita, gluOrtho disni masing-masing sisi

berukuran 15, jadi titik koordinat objek tidak boleh

melebihi itu. Disini saya juga menggunakan warna

hijau sebagai warna untuk objek glColor3f(0,1,0);

4. Segitiga sama sisi

Source Code:

#include <windows.h>#include <gl\gl.h>#include <gl\glut.h>

void init(void);void display(void);void keyboard(unsigned char, int, int);

int main (int argc, char **argv){glutInit(&argc, argv);glutInitDisplayMode(GLUT_DOUBLE | GLUT_RGB);glutInitWindowSize(100, 100);glutInitWindowPosition(100, 100);glutCreateWindow("Nur Amalianda");init();glutDisplayFunc(display);

glutMainLoop();return 0;

}

void init(void){

glClearColor(0.0, 0.0, 0.0, 0.0);glMatrixMode(GL_PROJECTION);glLoadIdentity();glOrtho(-15.0, 15.0, -15.0, 15.0, -15.0, 15.0);

}

void display(void){

glBegin(GL_TRIANGLES);glColor3f(0,1,0);

glVertex3f(8.5, 0.0, 0.0);glVertex3f(4.0, 4.0, 0.0);glVertex3f(4.0, -4.0, 0.0);

glEnd();glutSwapBuffers();

}

Screenshoot:

Penjelasan :Dalam program ini dapat di jelaskan cara membuat segitiga sama sisi dengan pemanggilan GL_TRIANGLES dimana dengan ukuran window sizenya ada 3 angka di belakang nim kita, gluOrtho disni masing-masing sisiberukuran 15, jadi titik koordinat objek tidak bolehmelebihi itu. Disini saya juga menggunakan warna hijau sebagai warna untuk objek glColor3f(0,1,0);

D. KESIMPULAN

Didalam OpenGL pembuatan objek dilakukan dengan

titik-titik 3 dimensi, dengan mode GL_QUARDS, maka

otomatis setiap 4 titik digambar menjadi sebuah

bidang segi empat, sedangkan mode GL_LINES, pada

setiap 2 titik digambar menjadi sebuah garis.

Didalam tahap ini setiap garis atau bidang juga

dapat diatur warnanya. Fungsi yang digunakan

glColor3f. glColor3f(1.0, 0.0, 0.0, 0.0); Contoh di

atas menghasilkan warna merah.

1. fungsi-fungsi tersebut adalah:

a. glutInitWindowSize Fungsi ini untuk

membuat window yang akan digunakan untuk

menampilkan objek-objek 3D, format fungsi

ini adalah: void glutInitWindowSize(init

width, init height); void

glutInitWindowSize(500, 350); width adalah

lebar dari window yang akan dibuat (dalam

pixel), sedangkan height adalah tinggi

dari window (dalam pixel).

b. glutInit fungsi untuk memberi tahu MS VC++

bahwa OpenGL library dipakai pada program,

format fungsi ini adalah: void

glutInit(init *argcp, char **argv); argcp

dan argv adalah parameter identik yang

dipakai oleh fungsi main() pada C++, jadi

pastikan bahwa parameter ini sama dengan

parameter yang ada fungsi main() pada

setiap program grafik 3D.

c. glutInitDisplayMode Fungsi yang dipakai

untuk menginisialisasi model dari tampilan

(display mode), yang mempunyai format:

void glutInitDisplayMode(unsigned int

mode); variable mode diisi dengan:

GLUT_DOUBLE|GLUT_RGB|GLUT_DEPTH Pilihan

untuk variable mode amat sangat

bervariasi, tetapi program hanya akan

menggunakan tiga kombinasi diatas.

GLUT_DOUBLE berarti menggunakan buffer

pada window sebesar dua kali. GLUT_RGB

menggunakan Red Green Blue Alpha untuk

pewarnaan. GLUT_DEPTH berarti menggunakan

depth buffer agar objek 3D yang

ditampilkan akan terlihat lebih nyata.

Untuk mengkombinasikan variable mode yang

dipakai gunakan garis vertical(|).

d. glutCreateWindow Fungsi ini dipakai untuk

membuat/meng-create window, mempunyai

format sebagai berikut: Int

glutCreateWindow (char* name); Name adalah

nama dari window yang akan dibuat. Dengan

memakai empat fungsi tersebut maka telah

berhasil melakukan inisialisasi pada

OpenGL.

E. DAFTAR PUSTAKA

Tim Asisten Praktikum Grafika Komputer. 2015. Modul

1 tentang Pengenalan GLUT. Malang. Universitas Negeri

Malang.