Category Archives: Open GL

vicknite’s experience in graphics programming

Pemrograman Grafis Dengan OpenGL dan GLUT

TUtorial ini berisi bagaimana cara membuat program grafis dengan Open GL dan GLUT

Catatan include pada code di bawah bervariasi tergantung letak library header GL.h, GLU.h, glut.h yang diinstall. walaupun ditulis dengan C GLUT hanya sedikit mirip C atau C++.

#include <Windows.h>
#include <gl\GL.h>
#include <gl\GLU.h>
#include <gl\glut.h>


//<<<<<<<<<<<<<<<<<<<<<<< my initialization >>>>>>>>>>>>>>>>>>>>>>>>>>>>

//inisialisasi world dan display OpenGL

void myInit()
{
glClearColor(1.0,1.0,1.0,0);// setbackground to bright white
glColor3f(0.0f,0.0f,0.0f);//set drawing color to black
glPointSize(4.0);// set point size to 4 x 4 pixels
glMatrixMode(GL_PROJECTION); // set matrix projection
glLoadIdentity();
gluOrtho2D(0.0,640.0,0.0,480.0);//set 2D viewport
}

//baris baris kode berisi apa yang akan ditampilkan selama program berjalan atau main display loop. Disebut demikian karena fungsi ini akan dieksekusi berulang ulang selama program berjalan dengan suatu periode tertentu. Lebih lanjut periode tersebut dapat disetting dengan rentang waktu yang diinginkan.

void myDisplay()
{
glClear(GL_COLOR_BUFFER_BIT); //clear the screen
glBegin(GL_POINTS);//draw some point
glVertex2i(100,50);
glVertex2i(100,130);
glVertex2i(150,130);
glVertex2i(300,130);
glEnd();
glFlush();//send all output into display
}

inisialisasi program termasik inisialisasi GLUT inisialisasi Window dan main Display loop

//<<<<<<<<<<<<<<<<<<<<<<< main >>>>>>>>>>>>>>>>>>>>>>>
void main(int argc, char **argv)
{
glutInit(&argc,argv); // initialize glut toolkit
glutInitDisplayMode(GLUT_SINGLE|GLUT_RGB); //set display mode
glutInitWindowSize(640,480);
glutInitWindowPosition(100,150);
glutCreateWindow("my first OGL app");
glutDisplayFunc(myDisplay);
myInit();
glutMainLoop();
}

bila dieksekusi output resultnya :

the 4 points

contoh program sederhana,membuat 4 titik pada coordinate tertentu terhadap viewport dengan ukuran titik 4 x 4 pixel dan berwarna hitam,
prerequisite : akan lebih mudah bila anda memahami dulu dasar-dasar computer graphics
terdapat isu2 mengenai beberapa incompatibility pada GLUT 3.7

source :

http://stackoverflow.com/questions/14264/using-glut-with-visual-c-express-edition
http://www.xmission.com/~nate/glut.html
http://www.lighthouse3d.com/opengl/glut/
http://www.fshilljr.com
Computer Graphics 3rd Edition Using OpenGL, FS.Hill, JR., STEPHEN M. KELLEY, Pearson

Tutorial Pemrograman OpenGL

Follow this step:

1. Install GLUT

2. Pengenalan OpenGL dan GLUT

3. Dasar OpenGL 3D

other source:

vrlab.epfl.ch/~ssarni/tp/exercise8.html

diatas adalah salah satu source bagus tentang 3d pada OpenGL anda terdapat contoh mengenai bagaimana menggambar objek dan transformasi animasinya, serta bagaimana menggunakan camera

http://www.arcsynthesis.org/gltut/

Online book yang membahas lengkap dasar dasar 3D programming dan OpenGL programming mulai dari nol hingga advanced

Pemrograman Grafis 3D dengan OpenGL dan GLUT

Tutorial ini berisi konsep 3D dan  OpenGL 3D.

Sebuah dunia 3d terdiri dari 4 elemen, yaitu objek atau grup objek, material objek, pencahayaan, dan camera,
Objek 3d dari OpenGL terdiri dari beberapa proses sebelum ditampilkan pada suatu window.

objek melewati modelview matrix -> clipping ->projection matrix -> viewport matrix -> window
sebuah matrik hanya merupakan operasi matematika matrix sederhana. Matrix-matrix mentransformasikan objek menjadi tampilan sesuai yang diinginkan.

code dibawah adalah contoh mengatur kamera

void setCamera()
{
//set the camera
glMatrixMode(GL_MODELVIEW);
glLoadIdentity();
gluLookAt(3.3,3.3,3.0,0,0.25,0,0.0,1.0,0.0);
}

Suatu kamera mempunyai prinsip dengan mata. Pada dunia 3d sebuah kamera mempunyai titik posisi dan titik arah pandang dalam koordinat 3d x,y,z. posisi kamera sama dengan posisi “dari”mana kita melihat objek. titik arah pandang adalah arah “ke”mana mata kita memandang.

Pada OpenGL pengaturan suatu proyeksi diatur dengan mengatur matrix modelview. bisa dilihat pada code diatas bahwa ddibawah matrix model view di load suatu matriks identitas.


void cube()
{
//menggambar kubus dan transformasi tarnslasi ke titik 0.5 0.5 0.5 dan skala 1 1 1
glPushMatrix();
glTranslated(0.5,0.5,0.5);//cube
glScaled(1.0,1.0,1.0);
glutSolidCube(1.0);
glPopMatrix();
}

fungsi diatas adalah fungsi untuk menggambar model kubus solid. GLUT menyediakan objek sederhana yang langsung bisa dipanggil dengan mudah kerangka kubus dgn memanggil fungsi glutWireCube(x). Pada code diatas sebelum fungsi pemanggil obejk kubus dipanggil terjadi 2 buah transformasi yaitu skala dan rotasi. Tanpa ada push dan pop serta transformasi secara default objek akan dirender pada skala default dan posisi default yaitu x,y,z = 0 0 0.

Operasi push dan pop matriks adalah operasi penambahan stack matriks pada modelview matriks untuk transformasi. tanpa push berarti menambahkan matriks, pada code diatas ditambahkan transalasi atau pergeseran dx,dy,dz = 0,5 0,5 0,5. operasi pop . Matriks tarnsformasi dirubah dengan menambahkan translate dan scale pada stack matriks model view sehingga objek kubus yang dipanggil melalui perhitungan tarnsformasi. glPop mengeluarkan matriks tarnsformasi keluar dari tumpukan sehingga mengambalikan matriks modelview menjadi matriks identitas.

code lengkap :


#include <Windows.h>
#include <iostream>
#include <gl\GL.h>
#include <gl\GLU.h>
#include <gl\glut.h>
#include <math.h>


void cube()
{
//menggambar kubus dan transformasi tarnslasi ke titik 0.5 0.5 0.5 dan skala 1 1 1
glPushMatrix();
glTranslated(0.5,0.5,0.5);//cube
glScaled(1.0,1.0,1.0);
glutSolidCube(1.0);
glPopMatrix();
}


void setMaterial()
{
//set properties of surfaces material
GLfloat mat_ambient[] = {0.7f,0.7f,0.7f,1.0f}; // ada 4 jenis material yang dipakai, dengan kombinasi warna tertentu
GLfloat mat_diffuse[] = {0.6f,0.6f,0.6f,1.0f};
GLfloat mat_specular[] = {1.0f,1.0f,1.0f,1.0f};
GLfloat mat_shininess[] = {50.0f};
glMaterialfv(GL_FRONT,GL_AMBIENT,mat_ambient);
glMaterialfv(GL_FRONT,GL_DIFFUSE,mat_diffuse);
glMaterialfv(GL_FRONT,GL_SPECULAR,mat_specular);
glMaterialfv(GL_FRONT,GL_SHININESS,mat_shininess);
}


void setLighting()
{
//set light sources
GLfloat lightIntensity[] = {0.7f,0.7f,0.7f,1.0f};//mensetting pencahayaan
GLfloat light_position[] = {2.0f,6.0f,3.0f,0.0f};
glLightfv(GL_LIGHT0,GL_DIFFUSE,lightIntensity);
glLightfv(GL_LIGHT0,GL_POSITION,light_position);
}


void setViewport()
{
glMatrixMode(GL_PROJECTION);
glLoadIdentity();
double winHt = 1.0;//half height of the window
glOrtho(-winHt*64/48,winHt*64/48,-winHt,winHt,0.1,100.0);
}


void setCamera()
{
//set the camera
glMatrixMode(GL_MODELVIEW);
glLoadIdentity();
gluLookAt(3.3,3.3,3.0,0,0.25,0,0.0,1.0,0.0);
}


void displayObject()
{
setMaterial();
setLighting();
setViewport();
setCamera();
//startDrawing
glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);
cube();//memanggil fungsi menggambar kubus
glFlush();//mengirim smua objek untuk dirender
}


void main(int argc, char **argv)
{
glutInit(&argc,argv);
glutInitDisplayMode(GLUT_SINGLE|GLUT_RGB|GLUT_DEPTH);
glutInitWindowSize(640,480);
glutInitWindowPosition(100,100);
glutCreateWindow("simple 3d scene");
glutDisplayFunc(displayObject);//fungsi dari display object yang menggabungkan kubus lighting material dan kamera
glEnable(GL_LIGHTING);
glEnable(GL_LIGHT0);
glShadeModel(GL_SMOOTH);
glEnable(GL_DEPTH_TEST);
glEnable(GL_NORMALIZE);
glClearColor(1.0f,1.0f,1.0f,0.0f);
glViewport(0,0,640,480);
glutMainLoop();
}

output :

voila sebuah kubus berwarna abu-abu tergambar. Namun kubus tersebut kurang tampak realistis karena proyeksi yang digunakan adalah ortogonal buka persepektif. Proyeksi perspektif akan membuat objek semakin realistis dengan menghadirkan efek jauh dekat objek.

Tutorial selanjutnya akan membawas masalah animasi dan interaksi dengan keyboard dan mouse.

Instalasi GLUT

OpenGL hanyalah tools untuk graphics semata, tanpa ada dukungan API untuk suara,input keyboard,mouse. GLUT adalah salah satu library pendukung OpenGL dalam hal itu namun tidak official. GLUT dikembangkan oleh Mark J. Kilgard. GLUT menjembatani windowing API yang biasanya memusingkan untuk programmer pemula. GLUT sangat efektif apabila digunakan untuk mempelajari Computer craphics tanpa harus mempelajari Win32 API terlebih dulu karena sudah terdefinisi pada GLUT.

Cara menambahkan Library GLUT di Visual Studio,

1. Download GLUT

2. Extract dan anda akan menemukan glut.def, glut.h, glut32.dll,glut32.lib

3. Baca readme

4. Bila merasa kesulitan memahami readme lanjut ke langkah 5

5. copy glut32.dll ke folder Windows\System

6. copy glut32.lib ke  \Program Files\Microsoft SDKs\Windows\v7.0A\lib

bila anda menggunakan versi Visual Studio 2005 keatas carilah folder VC\lib dan copy glut32.lib ke folder tersebut,intinya hanya memasukkan glut32.lib ke folder Library bahasa Visual C.

7.copy glut.h ke \Program Files\Microsoft SDKs\Windows\v7.0A\Include\gl atau cari folder include\gl pada microsoft windows SDK.

GLUT siap digunakan dengan mambahkan include glut.h pada source code kita.

Download referensi di sini. Dokumentasi ini menjelaskan dengan simpel dan ringan tentang elemen2 GLUT berbagai macam Terminology dan penggunaan fitur – fitur seperti GLUT initialization, callback,window management,Menu management dalam suatu aplikasi. Dokumentasi ini juga menceritakan tentang filosofi dan alasan desain GLUT yang memudahkan OpenGL graphics rendering. saat ini saya juga sedang membca dokumentasi tersebut dan akan saya ceritakan lebih lanjut apa yang saya telah pelajari nanti.