Modul Prak Komgraf 2

Laboratorium Multimedia
Praktikum
Komputer Grafik
[MODUL]
Ganjil
2012/2013
1/41
KONTRAK PRAKTIKUM
Nama Mata Kuliah
Kode Mata Praktikum
SKS
Mata Kuliah Prasyarat
Dosen Penanggung Jawab
Dosen Penyusun Modul
Semester / Th Ajaran
Hari Pertemuan / Jam
Tempat Pertemuan
: Praktikum Komputer Grafik

: TKC 111
:1
:: Abdullah Basuki Rahmat, S.Si., M.T.
: Abdullah Basuki Rahmat, S.Si., M.T.
Rima Tri Wahyuningrum, S.T., M.T.
: Ganjil / 2012-2013
: Sesuai Jadwal Praktikum
: Laboratorium Common Computing
Gambaran Umum :
Praktikum ini merupakan bagian dari kuliah Komputer Grafik. Dalam praktikum ini, praktikan
dikenalkan dengan beberapa aspek yang berkaitan dalam pemrograman komputer grafik.
Praktikum ini memuat beberapa modul yang berisi tentang struktur program OpenGL (Open
Graphics Library): primitif drawing, animasi, pencahayaan pada OpenGL, bayangan, tekstur I
dan tekstur II. Modul-modul ini harus dapat dikuasai oleh mahasiswa sebagai dasar penguasaan
Komputer Grafik.
Mahasiswa diharapkan dapat:
Mampu membuat dan memanfaatkan output primitif (titik, garis, segiempat, kurva,
lingkaran, elips, fill area, dan teks).
Mampu membuat dan memanfaatkan animasi.
Mampu membuat dan memanfaatkan pencahayaan pada OpenGL.
Mampu membuat dan memanfaatkan bayangan.
Mampu membuat dan memanfaatkan tekstur.
Tujuan Pembelajaran Praktimum

Mahasiswa mampu memahami dan menerapkan aplikasi komputer grafik menggunakan
bahasa pemrograman OpenGL.
Rumusan Kompetensi Dasar
Mahasiswa mampu memahami dan mengaplikasikan sistem grafik pada komputer.
Mahasiswa mampu memahami dan mengaplikasikan berbagai teknik dan komponen komputer
grafik.
Mahasiswa mampu memahami dan mengaplikasikan visualisasi obyek.
2/41
Referensi / Bahan Bacaan
E. Angel, Interactive Computer Graphics: A Top-Down Approach Using OpenGL,

Fourth Edition, Pearson Education Inc., 2006.
R. S. Wright, N. Haemel, G. Sellers and B. Lipchak, OpenGL Superbible:

Comprehensive Tutorial and Reference, Fifth Edition, Pearson Education Inc., 2011.
Alur bagi peserta praktikum :

1. Pada Tiap Sesi Pelaksanaan Praktikum:
a. Peserta praktikum menerima dan kemudian mempelajari modul
praktikum.
b. Peserta praktikum mengerjakan tugas pendahuluan yang diberikan.
c. Peserta praktikum melakukan asistensi tugas pendahuluan tersebut.
Asistensi ini digunakan bagi asisten untuk menilai kesiapan peserta juga
berfungsi sebagai ajang diskusi peserta praktikum atas kesuliatan yang
dialaminya.
d. Peserta Praktikum melakukan implementasi tugas praktikum di
laboratorium.
e. Peserta praktikum mendemokan implementasi pada asisten. Penilaian
yang dilakukan oleh asisten bersifat WISIWYG (What I see Is What You
Get).
2. Pada akhir pelaksanaan seluruh sesi praktikum, ada Post Test, berupa test
program.
Tugas
NO
KRITERIA
1
Jenis Tugas
INDIVIDU
Post Test
Tujuan
Mahasiswa memahami
dan menerapkan aplikasi
komputer grafik.
Jadwal Pengumpulan
Di akhir praktikum
Keluaran Tugas
Program + Penjelasan
3/41
KELOMPOK
1. Tugas Pendahuluan
2. Tugas Sesi Praktikum
Mampu menyelesaikan
masalah yang diberikan
dengan bahasa
pemrograman OpenGL.
1. Di awal sesi praktikum
2. Di akhir sesi praktikum
1. Program
2. Listing Program beserta
penjelasan (soft copy
Hardcopy di kumpulkan
di akhir kegiatan
praktikum)
Bobot Prosentase Penilaian Praktikum:

1. Pelaksanaan Praktikum 6 Modul
a. Tugas pendahuluan 15%
b. Kehadiran dan tugas praktikum 35%
c. Asistensi dan laporan praktikum 35%
2. Post Test + Laporan resmi 15%
Form Nilai
Asdos :
Kelas : A
Modul 1
No
NRP
Modul 2
Modul 3
Modul 4
Modul 5
Modul 6
Rata-rata
NAMA
n1
n2
n3
n1
n2
n3
n1
n2
n3
n1
n2
n3
n1
n2
n3
n1
n2
n3
n1
n2
n3
010041110000
85
80
78
85
83
84
83
82
78
85
80
76
83
79
76
85
78
74 84,33 80,33 77,67
78
77,45
008041110010
83
78
79
85
79
72
81
75
75
84
77
74
85
70
71
84
72
71 83,67 75,17 73,67
65
72,49
010041110005
87
85
88
86
85
87
85
87
86
86
88
87
87
78
79
86
78
77 86,17 83,50 84,00
83
83,10
010041110009
85
80
78
84
82
83
84
78
80
85
80
79
84
72
73
85
74
73 84,50 77,67 77,67
73
77,19
B+
010041110007
85
79
78
85
83
85
85
80
78
84
78
80
83
74
76
84
77
75 84,33 78,50 78,67
78
77,76
B+
010041110009
85
79
78
85
83
83
85
78
79
83
79
78
85
75
75
83
76
75 84,33 78,33 78,00
78
77,42
B+
Presentase Nilai
Kegiatan
%
Tugas Pendahuluan
15%
Kehadiran + Tugas Praktikum35%
Asistensi + Laporan
35%
Posttest + Lapres
15%
Grade Nilai
Kegiatan
A
B+
B
C+
C
D
E
KET
n1
n2
n3
post test
%
> 80
> 75 - 80
> 70 - 75
> 65 - 70
> 60 - 65
50 - 60
< 50
Nilai
Point
Range
A
4
> 80
B+
3,5
>75 80
B
3
>70 75
C+
2,5
> 65 70
C
2
>60 65
D
1
50 - 60
E
0
< 50
Catatan : Range Nilai bisa berubah sesuai dengan kondisi kelas
Peraturan Praktikum :
Posttest
Nilai Nilai
+ Lapres
Akhir Huruf
Akhir
Toleransi keterlambatan bagi Praktikan adalah 5 menit dari jadwal praktikum

(konsekuensi : tidak boleh masuk, kecuali dengan alasan yang rasional) dengan
catatan diberi tugas tambahan
4/41
B+
Jika Tidak mengikuti kali praktikum tanpa alasan yang rasional (kecuali sakit dengan
keterang dokter atau ada keluarga inti yang meninggal) maka nilai untuk semua
modul praktikum adalah NOL
Praktikan diwajibkan untuk berpakaian rapi (tidak boleh kaos) dan bertingkah laku
secara sopan
Praktikan dilarang membuka situs selain yang bersangkutan dengan praktikum,

konsekuensinya nilai untuk modul praktikum bernilai NOL
Asistensi untuk tiap modul minimal 1x (jika tidak ada revisi) dan waktunya
maksimal H-1 sebelum praktikum, Jika tidak ada asistensi maka untuk modul yang
bersangkutan adalah NOL.
Kegiatan PLAGIASI dalam laporan praktikum akan diberikan nilai 0 untuk laporan
yang bersangkutan dan harus membuat surat pernyataan yang disertai dengan nama,
NPM, serta foto, yang diserahkan ke asisten praktikum masing-masing yang
nantinya akan ditempel di mading Lab.
NB: saat pelaksanaan praktikum terdapat praktikan yang kedapatan membuka social
media maka nilai untuk praktikum modul tersebut adalah 0
5/41
Modul 1
Primitif Drawing
I. Pengantar
Perkembangan komputer grafik menuntut para pengembang sistem aplikasi
komputer grafik untuk dapat mengembangkan suatu informasi yang dilengkapi dengan
visualisasi dan animasi, agar dapat lebih mudah dipahami oleh pihak yang menggunakan
sistem tersebut.
Komputer grafik telah menunjukkan kemajuan yang pesat dalam pengembangan
berbagai aplikasi untuk menghasilkan gambar komputer grafik yang digunakan untuk
menunjang berbagai bidang dengan teknologi grafik berbasis komputer. Penggunaan
komputer grafik telah lama digunakan dalam beberapa macam aplikasi, diantaranya
pendidikan, kedokteran, fisika, matematika, multimedia, dan lain-lain. Pada saat ini
komputer grafik sudah digunakan pada bidang sains, engineering, kedokteran, bisnis,
industri, pemerintahan, seni, hiburan, iklan, pendidikan, dan lain-lain.
Oleh karena itu, sudah semakin banyak pula bahasa pemrograman yang
dilengkapi dengan tools/library pembuatan grafik. Salah satu tools/library pembuatan
aplikasi grafik adalah OpenGL (Open Graphics Library). OpenGL (Open Graphics
Library) adalah suatu spefikasi grafik low-level yang menyediakan fungsi untuk
pembuatan grafik primitif termasuk titik, garis, dan lingkaran. OpenGL digunakan untuk
mendefinisikan suatu obyek, baik obyek 2 dimensi maupun obyek 3 dimensi.
OpenGL juga merupakan suatu antarmuka pemrograman aplikasi/API (Application
Programming Interface) yang tidak tergantung pada piranti dan platform yang digunakan,
sehingga OpenGL dapat berjalan pada sistem operasi Windows, UNIX dan sistem operasi
lainnya. OpenGL pada awalnya didesain untuk digunakan pada bahasa pemrograman
C/C++, namun dalam perkembangannya OpenGL dapat juga digunakan dalam bahasa
pemrograman yang lain seperti Java, Tcl, Ada, Visual Basic, Delphi, maupun Fortran.
Namun OpenGL di-package secara berbeda-beda sesuai dengan bahasa pemrograman yang
digunakan. Oleh karena itu, package OpenGL tersebut dapat di-download pada situs
http://www.opengl.org sesuai dengan bahasa pemrograman yang akan digunakan.
II. Primitif Drawing

Penghasilan citra pada komputer grafik menggunakan primitif grafik dasar.
Primitif ini memudahkan untuk merender (menggambar pada layar monitor)
sebagaimana penggunaan persamaan geometrik sederhana. Contoh primitif grafik dasar
(Gambar 2.1) adalah :
6/41
o Titik
o Garis, Segiempat
o Kurva, Lingkaran, ellipse, kurva bezier, kurva lainnya
o Fill area
o Text
Gambar 1. Primitif grafik
Obyek kompleks dapat dibuat dengan kombinasi dari primitif ini. Adapun contoh grafik
primitif yang lain adalah :
Poligaris yaitu urutan garis lurus yang saling terhubung.
Teks adalah bentuk bahasa tulisan dengan simbol-simbol tertentu. Teks

merupakan kumpulan lebih dari dua karakter.
Citra raster adalah gambar yang dibuat dengan piksel yang membedakan
bayangan dan warna. Citra raster disimpan dalam komputer sebagai larik bernilai
numerik. Larik tersebut dikenal sebagai piksel map atau bitmap. Ada tiga cara
untuk menghasilkan citra grafik yaitu citra didisain dengan tangan, citra yang
didapat dari perhitungan dan citra yang discan. Pemaparan citra raster dinyatakan
oleh piksel dengan video displays (Cathod-ray Tube CRT), flat panel dispalys
(LCD), hardcopy (printer laser, dot matrix printers, ink-jet printers). Contoh
proses pemaparan permukaan adalah citra yang ditangkap lalu disimpan di frame
buffer, kemudian digunakan untuk mewarnai sebuah titik pada permukaan
pemapar. Selanjutnya proses scan di CRT. Frame buffer adalah matriks 2
dimensi yang mewakili piksel pada pemapar. Ukuran matriks harus cukup untuk
menyimpan kedalam warna pemapar untuk semua piksel. Sebagai contoh
pemapar (monitor) berresolusi 1280 x 1024 mempunya kedalaman warna 24 bit
(~16 juta warna) membutuhkan ruang simpan sekitar 4 Mb.
o Piksel dan Bitmap. Jumlah bit yang digunakan untuk mewakili warna/bayangan dari
masin-masing piksel (picture element = pixel). 4 bit/piksel = 24 = 16 level abu-abu.
7/41
III. Program
Program primitve drawing
#include <windows.h>
#include <GL/gl.h>
#include <GL/glut.h>
void display(void)
{
/* bersihkan layar dari titik pixel yang masih ada */
glClear (GL_COLOR_BUFFER_BIT);
/* gambar poligon (rectangle) dengan titik sudut *
* (0.25, 0.25, 0.0) and (0.75, 0.75, 0.0) */
glColor3f (1.0, 1.0, 0.0);
glBegin(GL_POINTS);
glVertex3f (0.0, 0.0, 0.0);
glVertex3f (0.0, 0.8, 0.0);
glVertex3f (0.8, 0.0, 0.0);
glVertex3f (0.0, -0.8, 0.0);
glVertex3f (-0.8, 0.0, 0.0);
glEnd();
glFlush ();
}
void kunci(unsigned char key, int x, int y)
{
switch (key)
{
case 27 :
case 'q':
exit(0);
break;
}
glutPostRedisplay();
}
Int main(int argc, char *argv[])
{
glutInitWindowSize(200,200);
glutInitWindowPosition(100,100);
glutInitDisplayMode(GLUT_RGB | GLUT_SINGLE);
glutCreateWindow("Suprapto");
glutDisplayFunc(display);
glutKeyboardFunc(kunci);
glutMainLoop();
return 0;
}
IV. Percobaan
1. Gantilah sintak program yang berwarna merah bold untuk membuat berbagai
macam primitive drawing. Lakukan pengamatan apa yang terjadi
8/41
glBegin(GL_POINTS);
glBegin(GL_LINE_STRIP);
glBegin(GL_LINE_LOOP);
glBegin(GL_LINES);
glBegin(GL_TRIANGLES);
glBegin(GL_TRIANGLE_FAN);
glBegin(GL_TRIANGLE_STRIP);
glBegin(GL_QUADS);
glBegin(GL_QUAD_STRIP);
glBegin(GL_POLYGON);
2. Lakukan penyisipan glColor3f (X, X, X); pada tiap vertek, kemudian amati lagi
apa yang terjadi.
3. Lakukan pengaturan ketebalan titik dan garis dengan perintah glPointSize(x); dan
glLineWidth(x); kemudian amati apa yang terjadi.
V. Tugas
1. Cobalah program diatas lakukan percobaan sesuai dengan perintah diatas
2. Buat Segitiga sama kaki
3. Buat Gambar Kubus
4. Buat Warna Pelangi yang terdiri dari 7 warna
5. Buatlah Gambar segiempat dengan didalamnya diblok warna merah
9/41
Modul 2
Animasi
I. Pendahuluan
Review Praktikum sebelumnya
Sebelum ke modul selanjutnya, perhatikan sintak pada Tabel 1.
Tabel 1. Perintah-perintah OpenGL yang telah dipraktekan
Animasi.
Animasi, atau kebanyakan orang lebih banyak kenal dengan film animasi, adalah
film yang merupakan hasil dari pengolahan gambar tangan sehingga menjadi gambar
yang bergerak. Pada awal penemuannya, film animasi dibuat dari berlembar-lembar
kertas gambar yang kemudian di-"putar" sehingga muncul efek gambar bergerak.
Dengan bantuan komputer dan komputer grafik, pembuatan film animasi menjadi sangat
mudah dan cepat. Bahkan akhir-akhir ini lebih banyak bermunculan film animasi 3
dimensi daripada film animasi 2 dimensi.
Wayang kulit merupakan salah satu bentuk animasi tertua di dunia. Bahkan
ketika teknologi elektronik dan komputer belum diketemukan, pertunjukan wayang kulit
telah memenuhi semua elemen animasi seperti layar, gambar bergerak, dialog dan
ilustrasi musik.
Selain wayang ternyata animasi sudah berusia sangat tua. Sejak ditemukan
rangkaian gerak dalam bentuk gambar pada berbagai artefak pada jaman Mesir Kuno
2000 tahun sebelum masehi manusia sudah mencoba membuat ilustrasi gerakan yang
akhirnya berkembang menjadi animasi. Sampai akhirnya Paul Roget, Joseph Plateau dan
10/41
Pierre Desvigenes menemukan pola penglihatan mata, lahirlah dunia animasi yang
sampai sekarang mampu melahirkan berbagai keajaiban bagi para penontonnya. Dari
menghadirkan adegan-adegan lucu dalam tradisional cell animation, hingga special
effect dahsyat dalam Computer Graphics Animation yang dilahirkan studio-studio besar
Hollywood.
Sejak menyadari bahwa gambar dapat dipakai sebagai alternatif media
komunikasi, timbul keinginan menghidupkan lambang-lambang tersebut menjadi cermin
ekspresi kebudayaan. Terbukti dengan diketemukannya berbagai artefak pada peradapan
Mesir Kuno 2000 sebelum masehi. Salah satunya adalah beberapa panel yang
menggambarkan aksi dua pegulat dalam berbagai pose. Dalam salah satu ilustrasi
Leonardo da Vinci yang terkenal, dilukiskan anggota tubuh manusia dalam berbagai
posisi.Seorang artis Italy Gioto, juga melukiskan malaikat dalam posisi terbang dengan
repitisi gerakan.
Animasi sendiri tidak akan pernah berkembang tanpa ditemukannya prinsip dasar
dari karakter mata manusia yaitu: persistance of vision (pola penglihatan yang teratur ).
Paul Roget, Joseph Plateau dan Pierre Desvigenes, melalui peralatan optik yang mereka
ciptakan, berhasil membuktikan bahwa mata manusia cenderung menangkap urutan
gambar-gambar
pada
tenggang
waktu
tertentu
sebagai
suatu
pola.
Dalam
perkembangannya animasi secara umum bisa didefinisikan sebagai: Suatu sequence

gambar yang diekspos pada tenggang waktu tertentu sehingga tercipta sebuah ilusi
gambar bergerak.
Animation adalah Illusion Of Motion yang dibuat dari image statis yang
ditampilkan secara berurutan. Pada video atau film, animasi merancu pada teknik
dimana setiap frame dalam film dibuat secara terpisah. Frame bisa dihasilkan dari
komputer, dari fotografi atau dari gambar lukisan. Ketika frame-frame tersebut
digabungkan, maka terdapat ilusi perubahan gambar, sesuai dengan teori yang disebut
dengan persistance of vision.
II. Program
Program 1 garis silang
static float rotAngle = 0.;
void init(void)
{
glClearColor(0.0,0.0, 0.2, 0.0);
}
void display(void)
{
11/41
glClear(GL_COLOR_BUFFER_BIT);
glColor3f (0.0, 1.0, 0.0);
glPushMatrix();
glRotatef(-rotAngle, 0.0, 0.0, 0.1);
glBegin (GL_LINES);
glVertex2f (-0.5, 0.5);
glVertex2f (0.5, -0.5);
glEnd ();
glPopMatrix();
glColor3f (0.0, 0.0, 1.0);
glPushMatrix();
glRotatef(rotAngle, 0.0, 0.0, 0.1);
glBegin (GL_LINES);
glVertex2f (0.5, 0.5);
glVertex2f (-0.5, -0.5);
glEnd ();
glPopMatrix();
glFlush();
}
void reshape(int w, int h)
{
glViewport(0, 0, w, h);
glMatrixMode(GL_PROJECTION);
glLoadIdentity();
if (w <= h)
gluOrtho2D (-1.0, 1.0, -1.0*(GLfloat)h/(GLfloat)w, 1.0*(GLfloat)h/(GLfloat)w); else
gluOrtho2D (-1.0*(GLfloat)w/(GLfloat)h, 1.0*(GLfloat)w/(GLfloat)h, -1.0, 1.0);
glMatrixMode(GL_MODELVIEW);
glLoadIdentity();
}
void keyboard(unsigned char key, int x, int y)
{
switch (key)
{
case 'r':
case 'R':
rotAngle += 20.;
if (rotAngle >= 360.) rotAngle = 0.;
break;
case 27:
exit(0);
break;
default:
break;
}
}
int main(int argc, char** argv)
{
glutInit(&argc, argv);
12/41
glutInitDisplayMode (GLUT_SINGLE | GLUT_RGB);

glutInitWindowSize (300, 300);
glutCreateWindow (argv[0]);
init();
glutReshapeFunc (reshape);
glutKeyboardFunc (keyboard);
glutDisplayFunc (display);
glutMainLoop();
return 0;
}
Program 2 Membuat Kotak Berputar
static GLfloat spin = 0.0;
void display(void)
{
glClear(GL_COLOR_BUFFER_BIT);
glPushMatrix();
glRotatef(spin, 0.0, 0.0, 1.0);
glColor3f(1.0, 1.0, 1.0);
glRectf(-25.0, -25.0, 25.0, 25.0);
glPopMatrix();
glutSwapBuffers();
}
void spinDisplay(void)
{
spin = spin + 2.0;
if (spin > 360.0)
spin = spin - 360.0;
}
void init(void)
{
glClearColor (0.0, 0.0, 0.0, 0.0);
glShadeModel (GL_FLAT);
}
{
glViewport (0, 0, (GLsizei) w, (GLsizei) h);
glLoadIdentity();
glOrtho(-50.0, 50.0, -50.0, 50.0, -1.0, 1.0);
glLoadIdentity();
}
void mouse(int button, int state, int x, int y)
{
switch (button)
{
case GLUT_LEFT_BUTTON:
13/41
if (state == GLUT_DOWN)
glutIdleFunc(spinDisplay);
break;
case GLUT_MIDDLE_BUTTON:
case GLUT_RIGHT_BUTTON:
if (state == GLUT_DOWN)
glutIdleFunc(NULL);
break;
default:
break;
}
}
{
glutInitDisplayMode (GLUT_DOUBLE | GLUT_RGB);
glutInitWindowPosition (100, 100);
init ();
glutReshapeFunc(reshape);
glutMouseFunc(mouse);
glutMainLoop();
return 0;
}
Program 3 Membuat Gerakan Lengan
static int shoulder = 0, elbow = 0;
void init(void)
{
glClearColor (0.0, 0.0, 0.0, 0.0);
}
void display(void)
{
glPushMatrix();
glTranslatef (-1.0, 0.0, 0.0);
glRotatef ((GLfloat) shoulder, 0.0, 0.0, 1.0);
glTranslatef (1.0, 0.0, 0.0); glPushMatrix();
glScalef (2.0, 0.4, 1.0); glutWireCube (1.0);
glPopMatrix();
glTranslatef (1.0, 0.0, 0.0);
glRotatef ((GLfloat) elbow, 0.0, 0.0, 1.0);
glTranslatef (1.0, 0.0, 0.0); glPushMatrix();
glScalef (2.0, 0.4, 1.0);
glutWireCube (1.0);
glPopMatrix();
14/41
glPopMatrix();
glutSwapBuffers();
}
void reshape (int w, int h)
{
glMatrixMode (GL_PROJECTION);
glLoadIdentity ();
gluPerspective(65.0,
(GLfloat)
glLoadIdentity();
glTranslatef (0.0, 0.0, -5.0);
}
w/(GLfloat)
void keyboard (int key, int x, int y)

{
switch (key)
{
case 's':
shoulder = (shoulder + 5) % 360;
break;
case 'S':
shoulder = (shoulder - 5) % 360;
break;
case 'e':
elbow = (elbow + 5) % 360;
break;
case 'E':
elbow = (elbow - 5) % 360;
break;
case 27:
exit(0);
break;
default:
break;
}
}
void main(int argc, char** argv)
{
init ();
glutKeyboardFunc(keyboard);
glutMainLoop();
return 0;}
15/41
h,
1.0,
20.0);
Program 4 membuat planet

static year = 0, day = 0;
void init(void)
{
glClearColor (0.0, 0.0, 0.0, 0.0);
}
void display(void)
{
glColor3f (1.0, 1.0, 1.0);
glPushMatrix();
glutWireSphere(1.0, 20, 16); /* gambar matahari */
glRotatef ((GLfloat) year, 0.0, 1.0, 0.0);
glTranslatef (2.0, 0.0, 0.0);
glRotatef ((GLfloat) day, 0.0, 1.0, 0.0);
glutWireSphere(0.2, 10, 8); /* gambar planet kecil */
glPopMatrix();
glutSwapBuffers();
}
{
glLoadIdentity ();
gluPerspective(60.0, (GLfloat) w/(GLfloat) h, 1.0, 20.0); glMatrixMode(GL_MODELVIEW);
glLoadIdentity();
gluLookAt (0.0, 0.0, 5.0, 0.0, 0.0, 0.0, 0.0, 1.0, 0.0);
}
void keyboard (int key, int x, int y)
{
switch (key)
{
case 'd':
day = (day + 10) % 360;
break;
case 'D':
day = (day - 10) % 360;
break;
case 'y':
year = (year + 5) % 360;
break;
case 'Y':
year = (year - 5) % 360;
break;
16/41
case 27:
exit(0);
break;
default:
break;
}
}
void main(int argc, char** argv)
{
init ();
glutMainLoop();
return 0;
}
III. Tugas
1. Cobalah program diatas !
2. Amati pada fungsi program inti !
3. Amati pada fungsi masukan !
4. Dari praktikum sebelumnya sampai sekarang, buatlah program untuk menampilkan
gambar segiempat dengan warna yang dapat diubah dengan menggunakan tombol panah
dan
5. Ubahlah program 1 supaya kedua garis yang muncul pada gambar menjadi bergerak
searah dengan simpangan 90 derajat antara keduanya !
6. Pada program 2 ubahlah program supaya bergerak jika di tekan tombol keyboard P
atau p !
7. Pada program 4 Lakukan perubahan nilai pada gluLookAt (0.0, 0.0, 5.0, 0.0, 0.0, 0.0,
0.0, 1.0, 0.0); dan glScalef (1.0, 2.0, 1.0); !
8. Pada program 4 sintak glutWireCube (1.0); lakukan perubahan dengan sintak
glutWireSphere(1.0, 40, 16); dengan melakukan perubahan nilai pada gluLookAt (0.0,
0.0, 5.0, 0.0, 0.0, 0.0, 0.0, 1.0, 0.0); dan glScalef (1.0, 2.0, 1.0); kemudian amati apa
yang terjadi?
9. Pada program 4. Buatlah gambar lintasan bumi yang mengelilingi matahari!
17/41
Modul 3
Pencahayaan pada OpenGL
I. Pendahuluan
OpenGL akan melakukan komputasi warna setiap pixel di display akhir,
ditampilkan adegan itu dilakukan di frame buffer. Bagian dari komputasi ini tergantung
pada pencahayaan yang digunakan dalam adegan dan hal tersebut berkenaan dengan
bagaimana suatu benda dalam adegan yang memantulkan atau menyerap cahaya.
Sebagai contoh saja misalnya sebuah lautan memiliki warna yang berbeda pada cerah
maupun pada saat hari mendung. Adanya sinar matahari atau awan menentukan apakah
laut termelihat sebagai pirus terang atau abu-abu keruh kehijauan. Pada kenyataannya,
sebagian besar objek bahkan yang tidak terlihat tiga dimensi sampai mereka diterangi
cahaya. Pada gambar 2 menunjukkan dua versi dari adegan yang persis sama yaitu
sebuah bola, dimana satu dengan pencahayaan dan satu tanpa pencahayaan.
Gambar 2. Sebuah spere dengan diterangi cahaya dan tidak diterangi
Seperti ditunjukkan pada Gambar 2, wilayah gelap tampak tidak berbeda dari
bulatan dua dimensi . hal Ini menunjukkan betapa pentingnya interaksi antara obyek dan
cahaya adalah dalam menciptakan adegan tiga dimensi.
Agar obyek yang telah dibuat terlihat lebih nyata, diperlukan tambahan efek
pencahayaan pada obyek yang telah kita buat. Pencahayaan adalah proses pemberian
cahaya pada suatu obyek, dikenal dengan istilah lighting atau iluminasi. Pada OpenGL
terdapat sebuah perbedaan penting antara warna dan pencahayaan yang perlu pahami.
Ketika menggunakan pencahayaan atau tekstur pemetaan dengan efek pencahayaan
dihidupkan, warna dari vertex adalah efek kumulatif dari warna bahan dan cahaya yang
bersinar di puncak. Ketika pencahayaan dimatikan, maka warna dari vertex adalah efek
pengaturan warna dan warna yang berbeda dengan bahan warna.
18/41
Gambar 3. Contoh ambient, diffuse, dan specular pada pantulan cahaya
Dengan menggunakan OpenGL, dapat memanipulasi pencahayaan dan obyek dalam

sebuah adegan untuk menciptakan berbagai macam efek. Dalam pokok bahasan pada bab
pencahayaan akan dimulai dengan sebuah pencahayaan yang penting pada permukaan
tersembunyi
penghapusan.
Kemudian
menjelaskan
bagaimana
untuk
mengontrol
pencahayaan dalam suatu adegan, membahas model konseptual OpenGL pencahayaan, dan
menggambarkan secara rinci cara mengatur pencahayaan dengan banyak parameter untuk
mendapatkan efek tertentu. Pada akhir bab, perhitungan matematis yang menentukan
bagaimana warna mempengaruhi pencahayaan disajikan
Pencahayaan pada OpenGL dan Dunia Nyata

Ketika melihat permukaan fisik, persepsi warna pada mata tergantung pada distribusi
energi foton yang datang dan memicu sel-sel kerucut mata. Foton berasal dari sumber
cahaya atau kombinasi dari sumber, yang sebagian diserap dan sebagian yang dipantulkan
oleh permukaan. Selain itu, permukaan yang berbeda memiliki sifat yang sangat berbedaada, misalnya yang mengkilap dengan sempurna akan memantulkan cahaya dalam arah
tertentu, sementara yang lain menyebarkan cahaya sama-sama masuk di segala penjuru.
Pencahayaan pada OpenGL hanya dengan cahaya pendekatan dan cahaya lampu seolah-olah
dapat dipecah menjadi komponen merah, hijau, dan biru. Dengan demikian, warna sumber
cahaya dicirikan oleh jumlah warna yang memancarkan cahaya merah, hijau, dan biru, dan
materi permukaan ditandai dengan persentase komponen warna merah, hijau, dan biru yang
masuk dan tercermin dalam berbagai arah. Persamaan pencahayaan pada OpenGL hanya
sebuah pendekatan, tetapi satu yang bekerja cukup baik dan dapat dihitung relatif cepat. Jika
menginginkan yang lebih akurat atau model pencahayaan hanya berbeda, harus melakukan
perhitungan sendiri dalam perangkat lunak. Dengan perangkat lunak tersebut dapat menjadi
sangat kompleks, seperti beberapa jam membaca buku teks optik pun harus meyakinkan.
19/41
Model pencahayaan dalam OpenGL, cahaya dalam sebuah adegan berasal dari
beberapa sumber cahaya yang dapat secara individual diaktifkan dan dinonaktifkan.
Beberapa cahaya datang dari arah atau posisi tertentu, dan beberapa cahaya umumnya
tersebar karena adanya suatu peristiwa. Sebagai contoh, ketika menghidupkan bola lampu
dalam ruangan, sebagian besar berasal dari cahaya bola lampu, tetapi beberapa cahaya
datang setelah ada pantulan dari dinding satu, dua, tiga, atau lebih. Cahaya yang memantul
ini disebut ambient dan dapat diasumsikan begitu cahaya tersebar tidak ada cara untuk
mengetahui arah semula, tetapi hal ini akan menghilang jika suatu sumber cahaya
dimatikan. Akhirnya, mungkin ada cahaya ambient umum dalam adegan yang tidak
berasal dari sumber tertentu, seolah-olah telah tersebar beberapa kali sumber cahaya asli
dan tidak mungkin untuk menentukan. Dalam model OpenGL, sumber cahaya hanya
memiliki efek ketika ada permukaan yang menyerap dan memantulkan cahaya. Setiap
permukaan diasumsikan terdiri dari bahan dengan berbagai sifat. Sebuah bahan dapat
memancarkan cahaya sendiri seperti lampu pada sebuah mobil atau mungkin
menyebarkan beberapa cahaya yang masuk ke segala penjuru, dan mungkin juga
memantulkan sebagian dari cahaya masuk dalam arah preferensial seperti cermin atau
permukaan
mengilap.
Model pencahayaan
yang OpenGL mempertimbangkan
pencahayaan yang dibagi menjadi empat komponen independen: memancarkan (emissi),

ambient, diffuse, dan specular. Semua empat komponen dihitung secara independen dan
kemudian ditambahkan secara bersama-sama.
Cahaya Ambient, Diffuse, dan Specular
Pencahayaan ambient adalah cahaya yang sudah berserakan begitu banyak
disebabkan oleh lingkungan dan arahnya tidak mungkin ditentukan atau tampaknya
datang dari segala penjuru. Backlighting pada sebuah ruangan memiliki komponen
ambient besar, karena sebagian besar cahaya yang mencapai mata yang memantul dari
banyak permukaan. Sebuah lampu sorot kecil di luar rumah memiliki komponen
ambient, sebagian besar cahaya dalam arah yang sama, dan karena diluar, sangat sedikit
cahaya mencapai mata setelah memantul dari benda-benda lain. Ketika cahaya ambient
menyerang permukaan, maka akan tersebar merata di segala penjuru.
Komponen cahaya diffuse adalah komponen yang berasal dari satu arah, jadi
akan terang kalau hal tersebut terjadi tepat diatas sebuah permukaan dibandingkan jika
hampir tidak terjadi di atas permukaan. Setelah mengenai permukaan, akan tersebar
merata di segala penjuru, sehingga tampak sama-sama terang, tak peduli di mana mata
berada. Setiap cahaya yang datang dari posisi atau arah tertentu mungkin memiliki
komponen diffuse.
20/41
Cahaya specular datang dari arah tertentu, dan cenderung terpental pada
permukaan dalam arah yang diinginkan. sinar laser berkualitas tinggi memantul pada
cermin dan menghasilkan hampir 100 persen refleksi specular. Logam atau plastik
mengkilap memiliki komponen specular tinggi, dan kapur atau karpet telah hampir tidak
ada. Specularity dapat juga dianggap sebagai shininess.
Meskipun sumber cahaya memberikan satu distribusi frekuensi, komponen
ambient, diffuse, dan specular mungkin berbeda. Sebagai contoh, jika memiliki cahaya
putih di sebuah ruangan dengan dinding merah, cahaya yang tersebar cenderung menjadi
warna merah, meskipun cahaya secara langsung objek putih yang mencolok. OpenGL
memungkinkan untuk mengatur nilai merah, hijau, dan biru untuk setiap komponen
cahaya secara bebas.
II. Program
Program 1. Sebuah Lit Sphere. Dibawah ini merupakan langkah-langkah yang
diperlukan untuk menambahkan pencahayaan ke obyek.
Tentukan vektor normal untuk setiap sudut dari semua benda. Vektor normal ini
menentukan orientasi objek relatif terhadap sumber cahaya.
Buat, pilih, dan atur posisi satu atau lebih dari sebuah sumber cahaya.
Ciptakan dan pilih model pencahayaan, yang mendefinisikan tingkat cahaya

lingkungan global dan lokasi efektif dari sudut pandang (untuk keperluan
perhitungan pencahayaan).
Tentukan sifat-sifat material untuk objek-objek dalam adegan.
Contoh program dibawah akan menyelesaikan tugas ini. Program tersebut akan
menampilkan sebuah bola diterangi satu sumber cahaya.
program Menggambar sebuah Lit Sphere: light.c
#include <GL/gl.h>
#include <GL/glu.h>
void init(void)
{
GLfloat mat_specular[] = { 1.0, 1.0, 1.0, 1.0 };
GLfloat mat_shininess[] = { 50.0 };
GLfloat light_position[] = { 1.0, 1.0, 1.0, 0.0 };
glClearColor (0.0, 0.0, 0.0, 0.0);
glShadeModel (GL_SMOOTH);
glMaterialfv(GL_FRONT, GL_SPECULAR, mat_specular);
glMaterialfv(GL_FRONT, GL_SHININESS, mat_shininess);
glLightfv(GL_LIGHT0, GL_POSITION, light_position);
glEnable(GL_LIGHTING);
glEnable(GL_LIGHT0);
21/41
glEnable(GL_DEPTH_TEST);
}
void display(void)
{
glClear (GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
glutSolidSphere (1.0, 20, 16);
glFlush ();
}
{
glLoadIdentity();
if (w <= h)
glOrtho (-1.5, 1.5, -1.5*(GLfloat)h/(GLfloat)w, 1.5*(GLfloat)h/(GLfloat)w, - 10.0, 10.0);
else
glOrtho (-1.5*(GLfloat)w/(GLfloat)h, 1.5*(GLfloat)w/(GLfloat)h, -1.5, 1.5, -10.0, 10.0);
glLoadIdentity();
}
{
glutInitDisplayMode (GLUT_SINGLE | GLUT_RGB | GLUT_DEPTH);
glutInitWindowSize (500, 500); glutInitWindowPosition (100, 100);
init ();
glutMainLoop();
return 0;
}
Program 2 Obyek sphere
GLfloat light_diffuse[] ={1.0, 1.0, 0.0, 1.0};
GLfloat light_position[] ={1.0, 1.0, 1.0, 0.20}; GLUquadricObj *qobj;
void display(void)
{
glClear(GL_COLOR_BUFFER_BIT |GL_DEPTH_BUFFER_BIT);
glCallList(1); /* tampilan list render sphere */
glutSwapBuffers();
}
void gfxinit(void)
{
qobj = gluNewQuadric(); // glut Library
gluQuadricDrawStyle(qobj, GLU_FILL);
glNewList(1, GL_COMPILE); /* membuat tampilan sphere */
//gluSphere(radius, slices, stacks);
22/41
gluSphere(qobj, 1.0, 20, 20);

gluCylinder(qobj, 1, 1, 3, 20, 20);
gluDisk(qobj, 0.5, 1, 20, 20);
gluPartialDisk(qobj, 0.5, 1, 20, 20, 45, 270);
Lakukan percobaan dengan memilih salah satu dari sintak dengan warna merah
tebal. Lakukan perubahan nilai.
glEndList();
glLightfv(GL_LIGHT0, GL_DIFFUSE, light_diffuse);
// gluPerspective(field of view in degree, aspect ratio, Z near, Z far );
gluPerspective(40.0, 1.0, 1.0, 10.0);
gluLookAt(0.0, 0.0, 5.0, 0.0, 0.0, 0.0, 0.0, 1.0, 0.);
glTranslatef(0.0, 0.0, -1.0);
}
int main(int argc, char **argv)
{
glutInitDisplayMode(GLUT_DOUBLE | GLUT_RGB | GLUT_DEPTH);
glutCreateWindow("sphere");
gfxinit();
glutCreateWindow("pencahayaan");
gfxinit();
glutMainLoop();
return 0;
}
Program 3 Objek Kubus
GLfloat light_diffuse[] = {1.0, 0.0, 0.0, 1.0}; /* warna merah terang. */
GLfloat light_position[] = {1.0, 1.0, 1.0, 0.0};
GLfloat n[6][3] = { /* secara normal kubus ada 6 muka. */
{-1.0, 0.0, 0.0}, {0.0, 1.0, 0.0}, {1.0, 0.0, 0.0}, {0.0, -1.0, 0.0}, {0.0, 0.0, 1.0}, {0.0,
0.0, -1.0} };
GLint faces[6][4] = { {0, 1, 2, 3}, {3, 2, 6, 7}, {7, 6, 5, 4}, {4, 5, 1, 0}, {5, 6, 2, 1}, {7,
4, 0, 3} };
GLfloat v[8][3];
void drawBox(void)
{
int i;
for (i = 0; i < 6; i++)
{
glBegin(GL_QUADS);
glNormal3fv(&n[i][0]);
23/41
glVertex3fv(&v[faces[i][0]][0]);
glEnd();
}
}
void display(void)
{
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
drawBox();
glutSwapBuffers();
}
void init(void)
{
/* pengaturan data vertek kubus. */
v[0][0] = v[1][0] = v[2][0] = v[3][0] = -1;
v[4][0] = v[5][0] = v[6][0] = v[7][0] = 1;
v[0][1] = v[1][1] = v[4][1] = v[5][1] = -1;
v[2][1] = v[3][1] = v[6][1] = v[7][1] = 1;
v[0][2] = v[3][2] = v[4][2] = v[7][2] = 1;
v[1][2] = v[2][2] = v[5][2] = v[6][2] = -1;
/* meng-Enable-kan pencahayaan OpenGL single. */
glLightfv(GL_LIGHT0, GL_DIFFUSE, light_diffuse);
/* mengatur penglihatan kubus. */
/* sudut pandangan, aspek ratio, kedekatan Z, jauh Z */
gluPerspective(40.0,1.0, 1.0, 10.0);
gluLookAt(0.0, 0.0, 5.0, 0.0, 0.0, 0.0, 0.0, 1.0, 0.);
/* mengatur posisi kubus */
glRotatef(60, 1.0, 0.0, 0.0);
glRotatef(-20, 0.0, 0.0, 1.0);
}
int main(int argc, char **argv)
{
glutCreateWindow("kubus warna merah 3D dengan pencahayaan");
init();
glutMainLoop();
return 0;
}
24/41
III. Tugas
1. Cobalah program diatas
2. Lakukan perubahan sintak atau nilai yang ada dalam program diatas
3. Masukan hasil pengamatan dan masukan hasilnya yang disertai gambar hasil compile
dalam tabel pengamatan yang disesuaikan dengan pengamatan anda. (dengan MS
Office)
4. Buatlah gambar donat dilengkapi dengan pencahayaan satu sumber
5. Buatlah program gambar cone dilengkapi dengan pencahayaan satu sumber
25/41
Modul 4
Bayangan
I. Pengantar
Untuk menghasilkan gambar yang realistik perlu memodelkan pencerminan dan
pembiasan maupun memunculkan bayangan karena pengaruh dari adanya cahaya.
Dengan memodelkan pencerminan untuk benda yang reflektif seperti cermin akan
dihasilkan pantulan ataupun bayangan benda. Dan efek pembiasan cahaya dapat
dimodelkan pada benda yang transparan untuk menghasilkan penampakan obyek lain
yang berada di belakang obyek transparan tersebut serta efek pengumpulan cahaya bias.
Effek bayangan ini sangat penting karena dengan adanya effek tersebut seolah-olah
benda tersebut nampak nyata. Bayangan sebuah obyek benda harus disesuaikan dengan
bentuk benda aslinya dan asal sumber cahaya tersebut berada dan banyaknya sumber
cahaya.
Program 1
#include <math.h>
#include <stdio.h>
double rx = 0.0;
double ry = 0.0;
float l[] = { 0.0, 80.0, 0.0 }; // koordinat sumber cahaya
float n[] = { 0.0, -1.0, 0.0 };
float e[] = { 0.0, -60.0, 0.0 };
void help();
// obyek yang akan digambar draw()
{
glutSolidTeapot(30.0);
glutSolidSphere(40, 16, 16);
glutSolidCube (40);
Isi dengan salah satu saja (cetak merah tebal), dan berilah obyek yang selain dalam tabel
ini
}
//membuat proyeksi bayangan
void glShadowProjection(* l, * e, * n)
{
float d, c;
float mat[16];
d = n[0]*l[0] + n[1]*l[1] + n[2]*l[2];
c = e[0]*n[0] + e[1]*n[1] + e[2]*n[2] - d;
26/41
mat[0] = l[0]*n[0]+c; // membuat matrik. OpenGL menggunakan kolom matrik

mat[4] = n[1]*l[0];
mat[8] = n[2]*l[0];
mat[12] = -l[0]*c-l[0]*d;
mat[1] = n[0]*l[1];
mat[5] = l[1]*n[1]+c;
mat[9] = n[2]*l[1];
mat[13] = -l[1]*c-l[1]*d;
mat[2] = n[0]*l[2];
mat[6] = n[1]*l[2];
mat[10] = l[2]*n[2]+c;
mat[14] = -l[2]*c-l[2]*d;
mat[3] = n[0];
mat[7] = n[1];
mat[11] = n[2];
mat[15] = -d;
glMultMatrixf(mat); // kalikan matrik
}
void render()
{
glClearColor(0.0,0.6,0.9,0.0);
glClear(GL_COLOR_BUFFER_BIT|GL_DEPTH_BUFFER_BIT);
glLightfv(GL_LIGHT0, GL_POSITION, l);
glDisable(GL_CULL_FACE);
glDisable(GL_LIGHTING);
glColor3f(1.0,1.0,0.0);
glBegin(GL_POINTS);
glVertex3f(l[0],l[1],l[2]);
glEnd();
glColor3f(0.8,0.8,0.8);
glBegin(GL_QUADS);
glNormal3f(0.0,1.0,0.0);
glVertex3f(-1300.0,e[1]-0.1, 1300.0);
glVertex3f( 1300.0,e[1]-0.1, 1300.0);
glVertex3f( 1300.0,e[1]-0.1,-1300.0);
glVertex3f(-1300.0,e[1]-0.1,-1300.0);
glEnd();
// gambar bayangan
glPushMatrix();
glRotatef(ry,0,1,0);
glRotatef(rx,1,0,0);
glColor3f(0.0,0.0,0.8);
draw();
glPopMatrix();
//sekarang gambar bayangan yang muncul
27/41
glPushMatrix();
glShadowProjection(l,e,n);
glRotatef(ry,0,1,0);
glRotatef(rx,1,0,0);
glDisable(GL_LIGHTING);
glColor3f(0.4,0.4,0.4);
draw();
glPopMatrix();
glutSwapBuffers();
}
void keypress(unsigned char c, int a, int b)
{
( c==27 ) exit(0);
( c=='s' ) l[1]-=5.0;
( c=='w' ) l[1]+=5.0;
( c=='a' ) l[0]-=5.0;
( c=='d' ) l[0]+=5.0;
( c=='q' ) l[2]-=5.0;
( c=='e' ) l[2]+=5.0;
( c=='h' ) help();
}
void help()
{
printf("proyeksi contoh bayangan sebuah obyek teapot\n");
}
void idle()
{
rx+=0.4;
ry+=0.7;
render();
}
void resize(w, h)
{
glViewport(0, 0, w, h);
}
int main(argc, * argv[])
{
glutCreateWindow("proyeksi bayangan");
glutReshapeFunc(resize);
glutReshapeWindow(400,400);
glutKeyboardFunc(keypress);
glutDisplayFunc(render);
glutIdleFunc(idle);
glEnable(GL_NORMALIZE);
glEnable(GL_COLOR_MATERIAL);
28/41
glEnable(GL_TEXTURE_2D);
glLoadIdentity();
gluPerspective(60.0f, 1.0, 1.0, 400.0);
// Reset koordinat sebelum dimodifikasi/diubah
glLoadIdentity();
glTranslatef(0.0, 0.0, -150.0);
glutMainLoop();
return 0;
}
Tugas
2. Lakukan pengamatan sintak atau nilai yang ada dalam program diatas, kemudian
lakukan analisis sintak mana yang berhubungan dengan bayangan dan mana
pencahayaan (tulis dan masukan dalam laporan)
3. Setelah dicompile Lakukan perubahan bayangan dan pencahayaan dengan menekan
tombol:
s/w
memindahkan sumber cahaya

naik/turun
a/d
memindahkan sumber cahaya ke

kanan/ke kiri
q/e
memindahkan sumber cahaya ke

depan atau ke belakang
4. Buatlah sebuah program yang menampilkan bayangan sebuah obyek benda yang
berbeda dengan program diatas disertai pencahayaan.
5. Buatlah benda kubus yang terletak di meja dengan disertai pencahayaan dan
bayangannya (sudut nya bebas)
6. Buatlah gambar tabung dilengkapi dengan bayangan dengan sudut 45 disertai
pengkabutan dengan ketebalan 40%
29/41
Modul 5
Tekstur I
I. Pengantar
Tekstur adalah tampilan permukaan (corak) dari suatu benda yang dapat dinilai
dengan cara dilihat atau diraba. Pada prakteknya, tekstur sering dikategorikan sebagai
corak dari suatu permukaan benda, misalnya permukaan karpet, baju, kulit kayu, dan
lain sebagainya. Tekstur merupakan karakteristik intrinsik dari suatu citra yang terkait
dengan tingkat kekasaran (roughness), granularitas (granulation), dan keteraturan
(regularity) susunan struktural piksel. Aspek tekstural dari sebuah citra dapat
dimanfaatkan sebagai dasar dari segmentasi, klasifikasi, maupun interpretasi citra.
Tekstur dapat didefinisikan sebagai fungsi dari variasi spasial intensitas piksel (nilai
keabuan) dalam citra. Berdasarkan strukturnya, tekstur dapat diklasifikasikan dalam dua
golongan :
a. Makrostruktur
Tekstur makrostruktur memiliki perulangan pola lokal secara periodik pada suatu daerah
citra, biasanya terdapat pada pola-pola buatan manusia dan cenderung mudah untuk
direpresentasikan secara matematis.
Gambar 1. Contoh tekstur makrostruktur

b. Mikrostruktur
Pada tekstur mikrostruktur, pola-pola lokal dan perulangan tidak terjadi begitu jelas,
sehingga tidak mudah untuk memberikan definisi tekstur yang komprehensif.
Gambar 2. Contoh tekstur mikrostruktur
30/41
Program 1
/* Program evaluasi untuk mengevaluasi kurva
* permukaan secara otomatis menentukan koorditan texture
*/
#include <stdlib.h>
#include <math.h>
GLfloat ctrlpoints[4][4][3] = {
{{ -1.5, -1.5, 4.0}, { -0.5, -1.5, 2.0},
{0.5, -1.5, -1.0}, {1.5, -1.5, 2.0}},
{{ -1.5, -0.5, 1.0}, { -0.5, -0.5, 3.0},
{0.5, -0.5, 0.0}, {1.5, -0.5, -1.0}},
{{ -1.5, 0.5, 4.0}, { -0.5, 0.5, 0.0},
{0.5, 0.5, 3.0}, {1.5, 0.5, 4.0}},
{{ -1.5, 1.5, -2.0}, { -0.5, 1.5, -2.0},
{0.5, 1.5, 0.0}, {1.5, 1.5, -1.0}}
};
GLfloat texpts[2][2][2] = {{{0.0, 0.0}, {0.0, 1.0}},
{{1.0, 0.0}, {1.0, 1.0}}};
void display(void)
{
glColor3f(1.0, 1.0, 1.0);
glEvalMesh2(GL_FILL, 0, 20, 0, 20);
glFlush();
}
#define imageWidth 64
#define imageHeight 64
GLubyte image[3*imageWidth*imageHeight];
void makeImage(void)
{
int i, j;
float ti, tj;
for (i = 0; i < imageWidth; i++)
{
ti = 2.0*3.14159265*i/imageWidth;
for (j = 0; j < imageHeight; j++)
{
tj = 2.0*3.14159265*j/imageHeight;
image[3*(imageHeight*i+j)] = (GLubyte) 127*(1.0+sin(ti));
image[3*(imageHeight*i+j)+1] = (GLubyte) 127*(1.0+cos(2*tj));
image[3*(imageHeight*i+j)+2] = (GLubyte) 127*(1.0+cos(ti+tj));
}
}
}
void init(void)
{
glMap2f(GL_MAP2_VERTEX_3, 0, 1, 3, 4, 0, 1, 12, 4, &ctrlpoints[0][0][0]);
glMap2f(GL_MAP2_TEXTURE_COORD_2, 0, 1, 2, 2, 0, 1, 4, 2, &texpts[0][0][0]);
31/41
glEnable(GL_MAP2_TEXTURE_COORD_2);
glEnable(GL_MAP2_VERTEX_3);
glMapGrid2f(20, 0.0, 1.0, 20, 0.0, 1.0);
makeImage();
glTexEnvf(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_DECAL);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_REPEAT);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MAG_FILTER, GL_NEAREST);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_MIN_FILTER, GL_NEAREST);
glTexImage2D(GL_TEXTURE_2D, 0, GL_RGB, imageWidth, imageHeight, 0, GL_RGB,
GL_UNSIGNED_BYTE, image);
}
{
glViewport(0, 0, (GLsizei) w, (GLsizei) h);
glLoadIdentity();
if (w <= h)
glOrtho(-4.0, 4.0, -4.0*(GLfloat)h/(GLfloat)w, 4.0*(GLfloat)h/(GLfloat)w, -4.0, 4.0);
else
glOrtho(-4.0*(GLfloat)w/(GLfloat)h, 4.0*(GLfloat)w/(GLfloat)h, -4.0, 4.0, -4.0, 4.0);
glLoadIdentity();
glRotatef(85.0, 1.0, 1.0, 1.0);
}
{
switch (key)
{
case 27:
exit(0);
break;
}
}
{
glutInitDisplayMode (GLUT_SINGLE | GLUT_RGB | GLUT_DEPTH); glutInitWindowSize
(500, 500);
init ();
glutMainLoop();
return 0;
}
32/41
Program 2
/* program mendemontrasikan texture menggunakan glBindTexture()
* untuk membuat dan mengatur 2 texture */
/* membuat texture papan catur */
#include <stdlib.h>
#include <stdio.h>
#ifdef GL_VERSION_1_1
#define checkImageWidth 64
#define checkImageHeight 64
static GLubyte checkImage[checkImageHeight][checkImageWidth][4];
static GLubyte otherImage[checkImageHeight][checkImageWidth][4];
static GLuint texName[2];
void makeCheckImages(void)
{
int i, j, c;
for (i = 0; i < checkImageHeight; i++) {
for (j = 0; j < checkImageWidth; j++) {
c = ((((i&0x8)==0)^((j&0x8))==0))*255;
checkImage[i][j][0] = (GLubyte) c;
checkImage[i][j][3] = (GLubyte) 255;
c = ((((i&0x10)==0)^((j&0x10))==0))*255;
otherImage[i][j][0] = (GLubyte) c;
otherImage[i][j][1] = (GLubyte) 0;
}
}
}
void init(void)
{
glClearColor (0.0, 0.0, 0.0, 0.0);
glShadeModel(GL_FLAT);
makeCheckImages();
glPixelStorei(GL_UNPACK_ALIGNMENT, 1);
glGenTextures(2, texName);
glBindTexture(GL_TEXTURE_2D, texName[0]);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_CLAMP);
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_CLAMP);
glTexImage2D(GL_TEXTURE_2D, 0, GL_RGBA, checkImageWidth, checkImageHeight, 0,
GL_RGBA, GL_UNSIGNED_BYTE, checkImage);
33/41
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_CLAMP);

glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_CLAMP);
glTexEnvf(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_DECAL);
GL_RGBA, GL_UNSIGNED_BYTE, otherImage);
}
void display(void)
{
glBegin(GL_QUADS);
glTexCoord2f(0.0, 0.0);
glVertex3f(-2.0, -1.0, 0.0);
glVertex3f(-2.0, 1.0, 0.0);
glVertex3f(0.0, 1.0, 0.0);
glVertex3f(0.0, -1.0, 0.0);
glEnd();
glBegin(GL_QUADS);
glVertex3f(1.0, -1.0, 0.0);
glVertex3f(1.0, 1.0, 0.0);
glVertex3f(2.41421, 1.0, -1.41421);
glVertex3f(2.41421, -1.0, -1.41421);
glEnd();
glFlush();
}
{
glLoadIdentity();
gluPerspective(60.0, (GLfloat) w/(GLfloat) h, 1.0, 30.0);
glLoadIdentity();
}
{
switch (key) {
case 27:
exit(0);
break;
}}
34/41

{
glutInitDisplayMode(GLUT_SINGLE | GLUT_RGB | GLUT_DEPTH);
glutInitWindowSize(250, 250);
glutInitWindowPosition(100, 100);
glutCreateWindow(argv[0]);
init();
glutKeyboardFunc (keyboard);
glutMainLoop();
return 0;
}
#else int main(int argc, char** argv)
{
fprintf (stderr, "program tekstur didemontrasikan dengan OpenGL Versi 1.0.\n");
return 0;
}
#endif
Tugas
2. Lakukan perubahan sintak atau nilai yang ada dalam program diatas ( yang
berhubungan dengan texture saja)
3. Masukan hasil pengamatan dan masukan hasilnya yang disertai gambar hasil
compile dalam tabel pengamatan yang disesuaikan dengan pengamatan anda.
4. Pada labsheet praktikum topik ini belum di lengkapi dengan teori mengenai teksture
secara detail oleh karena itu buatlah makalah yang berisi tentang texture dengan
topik:
a. Tekture obyek serta Tekture koordinat NIM ganjil
b. Teksture matrik serta Pencahayaan dan teksture NIM genap
Makalah minimal 2 halaman A4 1 spasi, font: new time roman 12, tidak termasuk
contoh program kumpulkan soft copy. Hasil dikumpulkan minggu depan
35/41
Modul 6
Tekstur II
Program 1
/* membuat texture papan catur */
#include <stdlib.h>
#include <stdio.h>
#define checkImageWidth 64
#define checkImageHeight 64
#define subImageWidth 16
#define subImageHeight 16
static GLubyte checkImage[checkImageHeight][checkImageWidth][4];
static GLubyte subImage[subImageHeight][subImageWidth][4];
static GLuint texName;
void makeCheckImages(void)
{
int i, j, c;
for (i = 0; i < checkImageHeight; i++) {
for (j = 0; j < checkImageWidth; j++) {
c = ((((i&0x8)==0)^((j&0x8))==0))*255;
checkImage[i][j][3] = (GLubyte) 255;
}
}
for (i = 0; i < subImageHeight; i++) {
for (j = 0; j < subImageWidth; j++) {
c = ((((i&0x4)==0)^((j&0x4))==0))*255;
subImage[i][j][0] = (GLubyte) c;
subImage[i][j][1] = (GLubyte) 0;
}
}
}
void init(void)
{
glClearColor (0.0, 0.0, 0.0, 0.0);
glShadeModel(GL_FLAT);
makeCheckImages();
glGenTextures(1, &texName);
glBindTexture(GL_TEXTURE_2D, texName);
36/41
glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT);

}
void display(void)
{
glTexEnvf(GL_TEXTURE_ENV,
GL_DECAL);
glBegin(GL_QUADS);
glVertex3f(-2.0, -1.0, 0.0);
glVertex3f(-2.0, 1.0, 0.0);
glVertex3f(0.0, 1.0, 0.0);
glVertex3f(0.0, -1.0, 0.0);
glVertex3f(1.0, -1.0, 0.0);
glVertex3f(1.0, 1.0, 0.0);
glVertex3f(2.41421, 1.0, -1.41421);
glVertex3f(2.41421, -1.0, -1.41421);
glEnd();
glFlush();
glDisable(GL_TEXTURE_2D);
}
GL_TEXTURE_ENV_MODE,

{
glLoadIdentity();
gluPerspective(60.0, (GLfloat) w/(GLfloat) h, 1.0, 30.0);
glLoadIdentity();
}
void keyboard (unsigned char key, int x, int y
{
switch (key)
{
case 's':
case 'S':
glTexSubImage2D(GL_TEXTURE_2D, 0, 12, 44, subImageWidth, subImageHeight, GL_RGBA,
GL_UNSIGNED_BYTE, subImage);
37/41
break;
case 'r':
case 'R':
break;
case 27:
exit(0);
break;
default:
break;
}
}
{
glutInitDisplayMode(GLUT_SINGLE | GLUT_RGB | GLUT_DEPTH);
glutCreateWindow(argv[0]);
init();
glutMainLoop();
return 0;
}
#else
{
fprintf (stderr, "program didemontrasikan dengan OpenGL Versi 1.0.\n");
return 0;
}
#endif
Program 2
/* program menggambar texture teapot */
#include <stdlib.h>
#include <stdio.h>
#define stripeImageWidth 32 GLubyte stripeImage[4*stripeImageWidth];
#ifdef GL_VERSION_1_1 static GLuint texName;
#endif
void makeStripeImage(void)
{
int j;
for (j = 0; j < stripeImageWidth; j++) {
stripeImage[4*j] = (GLubyte) ((j<=4) ? 255 : 0);
stripeImage[4*j+1] = (GLubyte) ((j>4) ? 255 : 0);
stripeImage[4*j+2] = (GLubyte) 0;
stripeImage[4*j+3] = (GLubyte) 255;
}
}
38/41
/* pengaturan koordinat texture */

static GLfloat xequalzero[] = {1.0, 0.0, 0.0, 0.0};
static GLfloat slanted[] = {1.0, 1.0, 1.0, 0.0};
static GLfloat *currentCoeff;
static GLenum currentPlane;
static GLint currentGenMode;
void init(void)
{
glClearColor (0.0, 0.0, 0.0, 0.0);
glShadeModel(GL_SMOOTH);
makeStripeImage();
glGenTextures(1, &texName);
#endif
glTexParameteri(GL_TEXTURE_1D, GL_TEXTURE_MAG_FILTER, GL_LINEAR);
glTexParameteri(GL_TEXTURE_1D, GL_TEXTURE_MIN_FILTER, GL_LINEAR);
glTexImage1D(GL_TEXTURE_1D,
0,
GL_RGBA,
stripeImageWidth,
0,GL_RGBA,
GL_UNSIGNED_BYTE, stripeImage);
#else
glTexImage1D(GL_TEXTURE_1D, 0, 4, stripeImageWidth, 0,GL_RGBA, GL_UNSIGNED_BYTE,
ripeImage);
#endif
glTexEnvf(GL_TEXTURE_ENV, GL_TEXTURE_ENV_MODE, GL_MODULATE);
currentCoeff = xequalzero; currentGenMode = GL_OBJECT_LINEAR; currentPlane =
GL_OBJECT_PLANE;
glTexGeni(GL_S, GL_TEXTURE_GEN_MODE, currentGenMode);
glTexGenfv(GL_S, currentPlane, currentCoeff);
glEnable(GL_TEXTURE_GEN_S);
glEnable(GL_CULL_FACE);
glEnable(GL_AUTO_NORMAL);
glEnable(GL_NORMALIZE);
glFrontFace(GL_CW);
glCullFace(GL_BACK);
glMaterialf (GL_FRONT, GL_SHININESS, 64.0);
}
void display(void)
{
glPushMatrix ();
glRotatef(45.0, 0.0, 0.0, 1.0);
39/41
#endif
glutSolidTeapot(2.0);
glPopMatrix ();
glFlush();
}
{
glLoadIdentity();
if (w <= h)
glOrtho (-3.5, 3.5, -3.5*(GLfloat)h/(GLfloat)w,3.5*(GLfloat)h/(GLfloat)w, -3.5, 3.5);
else
glOrtho (-3.5*(GLfloat)w/(GLfloat)h, 3.5*(GLfloat)w/(GLfloat)h, -3.5, 3.5, -3.5, 3.5);
glLoadIdentity();
}
void keyboard (unsigned char key, int x, int y)
{
switch (key) {
case 'e':
case 'E':
currentGenMode = GL_EYE_LINEAR;
currentPlane = GL_EYE_PLANE;
break;
case 'o':
case 'O':
currentGenMode = GL_OBJECT_LINEAR;
currentPlane = GL_OBJECT_PLANE;
break;
case 's':
case 'S':
currentCoeff = slanted;
break;
case 'x':
case 'X':
currentCoeff = xequalzero;
break;
case 27:
exit(0);
break;
default:
40/41
break;
}
}
{
glutInitDisplayMode (GLUT_SINGLE | GLUT_RGB | GLUT_DEPTH);
init ();
glutMainLoop();
return 0;
}
Tugas
2. Lakukan perubahan sintak atau nilai yang ada dalam program diatas ( yang
berhubungan dengan texture saja)
3. Masukan hasil pengamatan dan masukan hasilnya yang disertai gambar hasil compile
dalam tabel pengamatan yang disesuaikan dengan pengamatan anda.
41/41

Modul Prak Komgraf 2

Diunggah oleh

Informasi Dokumen

Hak Cipta

Format Tersedia

Bagikan dokumen Ini

Bagikan atau Tanam Dokumen

Opsi Berbagi

Apakah menurut Anda dokumen ini bermanfaat?

Apakah konten ini tidak pantas?

Hak Cipta:

Format Tersedia

Modul Prak Komgraf 2

Diunggah oleh

Hak Cipta:

Format Tersedia

Laboratorium Multimedia

: Praktikum Komputer Grafik

Mahasiswa diharapkan dapat:

Mampu membuat dan memanfaatkan animasi.

Mampu membuat dan memanfaatkan pencahayaan pada OpenGL.

Mampu membuat dan memanfaatkan bayangan.

Mampu membuat dan memanfaatkan tekstur.

Tujuan Pembelajaran Praktimum

Mahasiswa mampu memahami dan mengaplikasikan sistem grafik pada komputer.

Mahasiswa mampu memahami dan mengaplikasikan visualisasi obyek.

Referensi / Bahan Bacaan

E. Angel, Interactive Computer Graphics: A Top-Down Approach Using OpenGL,

R. S. Wright, N. Haemel, G. Sellers and B. Lipchak, OpenGL Superbible:

Alur bagi peserta praktikum :

Bobot Prosentase Penilaian Praktikum:

74 84,33 80,33 77,67

71 83,67 75,17 73,67

77 86,17 83,50 84,00

73 84,50 77,67 77,67

75 84,33 78,50 78,67

75 84,33 78,33 78,00

Toleransi keterlambatan bagi Praktikan adalah 5 menit dari jadwal praktikum

Praktikan dilarang membuka situs selain yang bersangkutan dengan praktikum,

II. Primitif Drawing

Gambar 1. Primitif grafik

Poligaris yaitu urutan garis lurus yang saling terhubung.

Teks adalah bentuk bahasa tulisan dengan simbol-simbol tertentu. Teks

Tabel 1. Perintah-perintah OpenGL yang telah dipraktekan

perkembangannya animasi secara umum bisa didefinisikan sebagai: Suatu sequence

glutInitDisplayMode (GLUT_SINGLE | GLUT_RGB);

void keyboard (int key, int x, int y)

Program 4 membuat planet

Gambar 2. Sebuah spere dengan diterangi cahaya dan tidak diterangi

Gambar 3. Contoh ambient, diffuse, dan specular pada pantulan cahaya

Dengan menggunakan OpenGL, dapat memanipulasi pencahayaan dan obyek dalam

Pencahayaan pada OpenGL dan Dunia Nyata

yang OpenGL mempertimbangkan

pencahayaan yang dibagi menjadi empat komponen independen: memancarkan (emissi),

Ciptakan dan pilih model pencahayaan, yang mendefinisikan tingkat cahaya

Tentukan sifat-sifat material untuk objek-objek dalam adegan.

gluSphere(qobj, 1.0, 20, 20);

mat[0] = l[0]*n[0]+c; // membuat matrik. OpenGL menggunakan kolom matrik

memindahkan sumber cahaya

memindahkan sumber cahaya ke

memindahkan sumber cahaya ke

Gambar 1. Contoh tekstur makrostruktur

Gambar 2. Contoh tekstur mikrostruktur

glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_S, GL_CLAMP);

int main(int argc, char** argv)

glTexParameteri(GL_TEXTURE_2D, GL_TEXTURE_WRAP_T, GL_REPEAT);

void reshape(int w, int h)

/* pengaturan koordinat texture */

Anda mungkin juga menyukai