Академический Документы
Профессиональный Документы
Культура Документы
GRAFIKA KOMPUTER
MMS 2604 / 3 sks
Disusun Oleh :
DRS. JANOE HENDARTO MKOM.
P r og r a m S t ud i I l m u K om p ut e r
J ur us a n M a t e m a t ik a
F a k ul ta s M a t e ma t i ka d a n I l m u P e ng e t a hua n Al a m
U ni v e r s i ta s G a d ja h M a da
2006
BAB I
PENDAHULUAN
I.1
LATAR BELAKANG
www.digizoneku.com
Graphics Applications
Computer Aided Design (CAD)
www.digizoneku.com
Display Technologies
Cathode Ray Tubes (CRTs)
Electron Gun
Contains a filament that, when heated, emits a
stream of electrons
Electrons are focused with an electromagnet into
a sharp beam and directed to a specific point of
the face of the picture tube
The front surface of the picture tube is coated with
small phospher dots
When the beam hits a phospher dot it glows with a
brightness proportional to the strength of the
beam and how often it is excited by the beam
www.digizoneku.com
www.digizoneku.com
www.digizoneku.com
www.digizoneku.com
1/30 Sec
1/60 Sec
1/60 Sec
Field 2
Field 1
Frame
www.digizoneku.com
Cons:
www.digizoneku.com
10
www.digizoneku.com
11
Piksel dan Bitmap. Jumlah bit yang digunakan untuk mewakili warna/bayangan
dari masin-masing piksel (picture element = pixel). 4 bit/piksel = 24 = 16 level abuabu
II.1
Sebagaimana banyak piranti dan cara untuk pemaparan output grafika komputer,
demikian pula untuk piranti inputnya, yaitu :
o Keyboards
o Tombol
o Mouse
o Graphics tablets
o Joysticks dan trackballs
o Knobs
o Space balls dan data gloves
Masing-masing input ini mempunyai cara masing-masing untuk mengirimkan input ke
komputer. Input ini diinterpretasikan oleh aplikasi grafika komputer dan dipresentasikan
ke pengguna melalui layar monitor. Data yang diinputkan disebut primitif input.
Beberapa primitif input diantaranya sebagai berikut :
o Titik
o Strings (keyboards, suara)
o Pilihan (tombol, layar sentuh)
o Valuators (analogue dial)
o Locator (mouse)
o Ambil (pemilihan sebagian citra, mouse, lightpen)
II.2
Ada tiga komponen untuk kerangka kerja aplikasi grafika komputer, yaitu :
o Model aplikasi
o Program aplikasi
o Sistem grafik
Sekarang telah banyak beredar di pasaran aplikasi pengembang cepat (Rapid
Development Applications / RAD) seperti Delphi, Borland C++, Visual C++ dan Visual
Basic. RAD ini memudahkan dalam pembuatan antarmuka, form, tombol, dan lain-lain
sehingga dapat membantu percepatan dalam pembuatan program aplikasi grafik karena
kode yang kompleks untuk pembuatan antarmuka, form, tombol, dan lain-lain sudah
tidak perlu dibuat lagi. RAD juga langsung memudahkan pemrograman Windows
II.3
TRANSFORMASI
www.digizoneku.com
12
dengan baik
maka
diperlukan
Operasi matriks:
o Penambahan dan pengurangan
o Perkalian
o Determianan
o Transpos
o Kebalikan (inverse)
Operasi vektor
o Penambahan dan pengurangan
o Perkalian titik (dot product)
o Perkalian silang (cross product)
II.4
OpenGL
OpenGL adalah suatu spefikasi grafik yang low-level yang menyediakan fungsi
untuk pembuatan grafik primitif termasuk titik, garis, dan lingkaran. OpenGL digunakan
untuk mendefinisikan suatu objek, baik objek 2 dimensi maupun objek 3 dimensi.
OpenGL juga merupakan suatu antarmuka pemrograman aplikasi (application
programming interface (API) 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.
Selain OpenGL ada juga tools/library grafik yang dapat dipergunakan yaitu
DirectX. Namun tools ini hanya dapat dipergunakan pada Microsoft Windows. Tabel 2.1
menunjukkan perbandingan antara OpenGL dengan DirectX. Perbandingan ini didasarkan
pada buku OpenGL Game Programming, namun ada beberapa feature yang mungkin
sudah ditambahkan pada DirectX versi terbaru.
OpenGL
Vertex Blending
N/A
Multiple Operating Systems
Yes
Extension Mechanism
Yes
Development
Multiple member Board
Thorough Specification
Yes
Two-sided lighting
Yes
Volume Textures
Yes
Hardware independent Z-buffers
Yes
Accumulation buffers
Yes
Full-screen Antialiasing
Yes
Motion Blur
Yes
Depth of field
Yes
www.digizoneku.com
DirectX
Yes
No
Yes
Microsoft
No
No
No
No
No
Yes
Yes
Yes
13
Stereo Rendering
Point-size/line-width attributes
Picking
Parametric curves and surfaces
Cache geometry
System emulation
Interface
Updates
Source Code
Yes
Yes
Yes
Yes
Display Lists
Hardware not present
Procedure calls
Yearly
No
No
No
No
Vertex Buffers
Let app determine
COM
Yearly
Sample
SDK Implementation
Arti
Lokasi titik berada di (x,y)
glVertex2f(x,y);
glVertex3i(x,y,z);
glVertex3f(x,y,z);
glClearColour(R, G, B, );
glColor3f(R, G, B);
glColor4f(R, G, B);
glPointSize(k);
glBegin(GL_POINTS);
Titik
glBegin(GL_LINES);
Garis
www.digizoneku.com
Keterangan
Tipe argumennya adalah
integer dan 2 dimensi yaitu x
dan y
Tipe argumennya adalah
float dan 2 dimensi yaitu x
dan y
Tipe argumennya adalah
integer dan 2 dimensi yaitu
x, y dan z
Tipe argumennya adalah
float dan 2 dimensi yaitu x, y
dan z
Empat komponen warna
yaitu Red, Green, Blue dan
alpha
Tiga komponen warna yaitu
Red, Green dan Blue
Empat komponen warna
yaitu Red, Green, Blue dan
alpha
Besar kecilnya ukuran titik
tergantung pada k (integer)
Objek primitive (lihat gambar
2.2)
Objek primitive (lihat gambar
2.2)
14
glBegin(GL_LINE_STRIP);
Poligaris
glBegin(GL_LINE_LOOP);
glBegin(GL_TRIANGLES);
Segitiga
glBegin(GL_TRIANGLE_STRIP);
Segitiga
glBegin(GL_TRIANGLE_FAN);
Segitiga
glBegin(GL_QUADS);
Segiempat
glBegin(GL_QUAD_STRIP);
Segiempat
glBegin(GL_POLYGON);
Poligon
glBegin(GL_LINE_STIPPLE);
glBegin(GL_POLY_STIPPLE);
Garis putus-putus
Poligon
dengan
tertentu
Segiempat siku-siku
glEnd( );
y1,
pola
Objek
2.2)
Objek
2.2)
Objek
2.2)
Objek
2.2)
Objek
2.2)
Objek
2.2)
Objek
2.2)
Objek
2.2)
Objek
Objek
Tipe data
www.digizoneku.com
C atau C++
OpenGL
15
B
S
I
F
D
Ub
Us
Ui
II.5
Integer 8-bit
Integer 16-bit
Integer 32-bit
Floating 32-bit
Floating 64-bit
unsigned 8-bit
unsigned 16bit
unsigned 32bit
signed char
short
int atau long
float
double
unsigned char
unsigned short
GLbyte
GLshort
GLint, GLsizei
GLfloat, GLclampf
GLdouble, GLclampd
GLubyte, GLboolean
GLushort
www.digizoneku.com
16
terhadap objek yang sudah ada, misalnya dengan pencerminan, pergeseran, atau
pemutaran objek yang sudah digambar terlebih dahulu.
Kita akan mempelajari cara mentransformasikan objek grafis khususnya objek
grafis 2D sebagai salah satu cara untuk memanipulasi objek grafis dan sistem
koordinat yang dipakai dengan cara yang lebih terorganisir dan efisien. Salah satu
contoh penting untuk diketahui adalah pemakaian transformasi jendela ke
viewport.
Ada dua cara untuk melakukan transformasi, yaitu transformasi objek dan
transformasi kordinat. Pada transformasi objek semua titik pada sembarang objek
akan dirubah sesuai dengan aturan tertentu sementara kordinatnya tetap. Pada
transformasi sistem koordinat, objek tetap tetapi karena sistem koordinatnya
diganti maka kedudukan objek harus disesuaikan dengan kedudukan sistem
kordinat yangbaru.
Jenis-jenis transformasi
1. Translasi
Sembarang titik pada bidang xy bisa digeser ke sembarang tempat dengan
menambahkan besaran pada absis x dan ordinat y. Translasi adalah
transformasi dengan bentuk tetap memindahkan objek apa adanya. Dengan
menggunakan persamaan Q = PM + tr, maka hasil pergeseran bisa dinyatakan
sbb:
(Qx, Qy) = (Px +trx, Py+try)
dimana trx adalah vektor translasi menurut sumbu x sedang try adalah vektor
translasi menurut sumbu y, dan matrik M bisa dikatakan sebagai matrix
identitas.
Sembarang objek bisa digeser ke posisinya yang baru dengan mengoperasikan
persamaan diatas pada setiap titik dari objek tersebut. Hal ini karena setiap
garis dari objek tersebut terdiri dari titik-titik yang jumlahnya tak terbatas,
maka proses penggeseran bisa berlangsung sangat lama. Tetapi pada
kenyataannya kita cukup menggeser dua titik ujungnya saja dan kemudian
menggandeng dua titik tersebut untuk membentuk garis hasil pergeseran.
Contoh translasi:
Untuk menggambarkan translasi objek yang berupa garis dengan koordinat
A(10,10), B(30,10) dengan vektor translasi (10,20)
Titik A
www.digizoneku.com
17
PROGRAM TRANSFORMASI
Dengan memakai delphi, Buatlah program dengan tampilan seperti dibawah ini.
Bila program dijalankan, ada dua pilihan:
Jenis transformasi Memutar
Jika memilih transformasi memutar kita disuruh menginputkan besar sudut
yang diminta dan kemudian inputkan x1, y1, x2, y2 lalu klik gambar maka
akan tampil gambar pada kotak paintbox dan klik transformasi maka gambar
akan memutar sesuai sudut yang diisi. Dan gambar asli tetap nampak.
Jenis transformasi Perbesar/perkecil
Jika memilih transformasi perbesar/perkecil kita disuruh menginputkan besar
skalanya dan kemudian inputkan x1, y1, x2, y2 lalu klik gambar maka akan
tampil gambar pada kotak paintbox dan klik transformasi maka gambar akan
tampil sesuai skala yang diisi.
www.digizoneku.com
18
www.digizoneku.com
19
{ procedure transformasi }
procedure TForm1.TransformasiClick(Sender: TObject);
var
temp : Titik;
tet : integer;
s, kali : real;
lebar, tinggi : integer;
begin
{transformasi untuk memutar }
if ((IsiX1.Text='')or (IsiX2.text='') or (IsiY1.text='' )or (IsiY2.text='')or
(IsiX1.Text=' ')or (IsiX2.text=' ') or (IsiY1.text=' ' )or (IsiY2.text=' ')
or (IsiPil.text='')or (IsiPil.text=' ') or (RadioTransformasi.ItemIndex=-1)) then
MessageDlg('PENGISIAN DATA BELUM LENGKAP',mtWarning,
[mbOk],0)
else
if RadioTransformasi.itemindex = 0 then
begin
with ttk do
begin
tet:=strtoint(IsiPil.text);
s := tet * pi / 180;
temp.x1 := xn + round((x1 - xn)*(cos(s))-(y1 - yn)*(sin(s)));
temp.x2 := xn + round((x2 - xn)*(cos(s))-(y2 - yn)*(sin(s)));
temp.x3 := xn + round((x3 - xn)*(cos(s))-(y3 - yn)*(sin(s)));
temp.x4 := xn + round((x4 - xn)*(cos(s))-(y4 - yn)*(sin(s)));
temp.y1 := yn + round((x1 - xn)*(sin(s))+(y1 - yn)*(cos(s)));
temp.y2 := yn + round((x2 - xn)*(sin(s))+(y2 - yn)*(cos(s)));
temp.y3 := yn + round((x3 - xn)*(sin(s))+(y3 - yn)*(cos(s)));
temp.y4 := yn + round((x4 - xn)*(sin(s))+(y4 - yn)*(cos(s)));
end;
ttk.x1 := temp.x1;
ttk.x2 := temp.x2;
www.digizoneku.com
20
ttk.x3 := temp.x3;
ttk.x4 := temp.x4;
ttk.y1 := temp.y1;
ttk.y2 := temp.y2;
ttk.y3 := temp.y3;
ttk.y4 := temp.y4;
PaintBox1.Canvas.Brush.Color :=clred;
with ttk do
Paintbox1.canvas.Polygon([Point(x1, y1), Point(x2, y2), Point(x3, y3),
Point(x4, y4)]);
end
{transformasi untuk memperbesar/memperkecil }
else
begin
kali :=strtofloat(IsiPil.text);
with ttk do
begin
lebar := x3 - x1;
tinggi := y3 - y1;
x1 := xn - round(lebar / 2 * kali );
x3 := xn + round(lebar / 2 * kali );
y1 := yn - round(tinggi / 2 * kali );
y3 := yn + round(tinggi / 2 * kali );
x2 := x3;
y2 := y1;
x4 := x1;
y4 := y3;
end;
PaintBox1.Canvas.Brush.Color := clblue;
with ttk do
Paintbox1.canvas.Polygon([Point(x1, y1), Point(x2, y2), Point(x3, y3),
Point(x4, y4)]);
end;
end;
procedure TForm1.KeluarClick(Sender: TObject);
begin
Close;
end;
procedure TForm1.HapusClick(Sender: TObject);
begin
Paintbox1.Refresh;
Label1.caption := 'Pilihan ';
IsiPil.text := ' ';
IsiX1.text := ' ';
IsiX2.text := ' ';
www.digizoneku.com
21
www.digizoneku.com
22
BAB IV
GRAFIKA 3D
pada penggambaran
www.digizoneku.com
Objek tiga dimensi jelas memiliki banyak perbedaan dengan objek dua
dimensi. Dengan koordinat x, y, z yang diperlukan, membuat pengerjaan objek tiga
dimensi menjadi lebih rumit. Dalam pembuatannya, diperlukan koordinat untuk
menentukan sudut pandang pengamat, kedalaman yang diperlukan, dan transformasi
objek untuk mempermudah pengerjaan.
y '
0
z'
0
1
0
0
1
0
0
0
0
1
0
tx
ty
tz
1
x
y
z .. Operasi 4.1
1
Parameter tx, ty, dan tz menjelaskan perpindahan jarak untuk koordinat x, y, dan z.
Gambar 4.2 Memindahkan titik dengan translasi vektor T=(tx, ty, tz)
Sebuah bangun tiga dimensi yang ditranslasikan dengan vektor tertentu, dilakukan
dengan memindahkan titik-titik sesuai dengan vektor tersebut.
www.digizoneku.com
10
Gambar 4.3 Memindahkan balok dengan translasi vektor T=(tx, ty, tz)
4.1.3.2 Rotasi
Menurut Donald Hearn (1994), untuk merotasikan sebuat objek diperlukan
sumbu rotasi (poros untuk merotasikan objek) dan jumlah rotasi angular. Tidak seperti
rotasi pada objek dua dimensi, yang titik putarnya hanya pada sumbu x dan y, untuk
mentransformasikan objek tiga dimensi, titik dapat diletakkan di koodinat x, y, dan z.
a) Rotasi dengan z
sebagai sumbu putar
b) Rotasi dengan x
sebagai sumbu putar
c) Rotasi dengan y
sebagai sumbu putar
www.digizoneku.com
sin
cos
0
0
11
0 0 x
0 0 y
1 0 z
0 1 1
Operasi 4.2
0
sin
cos
0
0 x
0 y
0 z
1 1
Operasi 4.3
www.digizoneku.com
0 sin
1
0
0 cos
0
0
12
0 x
0 y
Operasi 4.4
0 z
1 1
x' s x
y' 0
z' 0
1 0
0
sy
0
0
0
0
sz
0
0 x
0 y Operasi 4.5
0 z
1 1
4.1.4 Proyeksi
Ada dua macam metode proyeksi yaitu proyeksi paralel dan proyeksi perspektif.
www.digizoneku.com
13
www.digizoneku.com
14
4.1.7 Viewport
Viewport adalah daerah layar yang dipilih untuk menampilkan objek yang
dimaksud (Santosa, 1994). Sebelum daerah layar dipilih, gambar dari objek asli
biasanya akan memenuhi ukuran layar. Sehingga diperlukan viewport (daerah layar)
untuk memetakan gambar tersebut agar dapat tampak sesuai dengan unkuran yang
dikehendaki pada layar, seperti ditunjukkan pada gambar 4.12
www.digizoneku.com
15
4.2 OpenGL
OpenGL adalah perangkat lunak yang langsung berinteraksi dengan perangkat
keras grafik. Perangkat ini terdiri lebih dari 150 perintah yang berbeda yang
digunakan untuk menggambarkan suatu objek dan operasi yang dibutuhkan untuk
membuat aplikasi tiga dimensi yang interkatif.
4.2.1 Pembuatan Objek
OpenGL dirancang sebagai perangkat yang instan dan tidak tergantung pada
sistem operasi dan bahasa pemrograman apapun. Perintah yang terdapat pada
OpenGL tetap sama
pada
semua
OpenGL tidak
www.digizoneku.com
16
(e)
Tempat untuk menuliskan parameter yang diperlukan sesuai dengan yang telah
ditulis lebih awal
OpenGL memiliki tipe data berikut:
Tipe Data Pada
Kode
Jumlah Bit
Tipe Data
byte
GLByte
16
short
GLShort
32
integer
32
floating point
64
double
ub
us
16
ui
32
char
GLdouble atau
GLclampz
Glubyte atau
GLboolean
unsigned integer
GLushort
GLuint atau GLenum
atau GLbitfield
www.digizoneku.com
OpenGL
17
Sebelum membuat objek, terlebih dahulu kita lihat contoh kode program OpenGL
sederhana berikut :
Program ContohKodeOpenGL;
use <fileYangDiperlukan.pas>
procedure main();
begin
InisialisasikanWindow();
glClearColor (0, 0, 0, 0);
glClear (GL_COLOR_BUFFER_BIT);
glColor3f (1, 1, 1);
glBegin(GL_QUADS);
glVertex3f (0.25, 0.25, 0);
glVertex3f (0.75, 0.25, 0);
glVertex3f (0.75, 0.75, 0);
glVertex3f (0.25, 0.75, 0);
glEnd();
glFlush();
PerbaharuiWindowDanCekEvent();
end;
www.digizoneku.com
18
sehingga nantinya berapapun nilai yang kita berikan untuk mengkombinasi nilai
RGBA pada parameter glclearcolor akan menjadi background pada window.
Setelah pemberian background selesai, langkah selanjutnya adalah dengan
mengetikkan perintah glclear(GL_COLOR_BUFFER_BIT), perintah ini dilakukan
untuk menghilangkan warna yang ada sebelumnya sehingga objek dengan warna baru
dapat ditampilkan. Tanpa mengetikkan perintah ini, maka objek yang telah dibuat
tidak dapat ditampilkan.
Setelah penginisialiasian tersebut dilakukan, maka mulailah membuat objek 2
atau 3 dimensi. Langkah-langkah untuk membuat objek 2 atau 3 dimensi akan
dijelaskan pada subbab setelah ini.
Ketika pengkodean untuk membuat objek selesai, maka ditulis perintah
glFlush() yang berfungsi untuk menjalankan program OpenGL tanpa harus
4.2.3.1 Titik
Titik pada koordinat 3 dimensi terletak pada posisi x, y, dan z, dapat pula
terletak pada posisinya di koordinat 2 dimensi. Secara default, titik digambar dengan
ketebalan 1 piksel. Namun hal itu dapat diubah dengan perintah berikut:
www.digizoneku.com
19
4.2.3.2 Garis
Membuat garis pada OpenGL dapat dibuat dengan menentukan letak titik awal
dan akhir pada koordinat 3 dimensi (x, y dan z), dapat pula dibuat dengan menentukan
posisi titik awal dan akhir pada koordinat 2 dimensi. Garis dapat dibuat dengan
www.digizoneku.com
20
ketebalan dan style yang berbeda, seperti titik-titik, garis-garis, dan gabungan antara
keduanya.
4.2.3.2.1 Ketebalan Garis
Ketebalan garis secara default adalah berukuran 1 piksel. Jika ukuran lebar garis
adalah 2, maka titik-titik penyusun garis itu berukuran 2x2 piksel. Ukuran ketebalan
pada garis tidak ditentukan selama ukuran tersebut bertype glfloat atau integer.
Sintaks untuk menambah ukuran ketebalan garis pada OpenGL adalah
glLineWidth (width: GLfloat)
Perbandingan antara garis berukuran 1 piksel dengan 2 piksel digambarkan
sebagai pada gambar 4.14
www.digizoneku.com
21
www.digizoneku.com
22
Pada kode di atas diketahui bahwa pembuatan garis dengan style tertentu perlu
diawali dengan glEnable(GL_LINE_STIPPLE) dan diakhiri dengan
glDisable(GL_LINE_STIPPLE). Perintah glLineStipple(3,5423) mengandung
pengertian bahwa parameter factor bernilai 3 dan parameter pattern bernilai 5423.
Untuk mengetahui pattern yang dihasilkan, diperoleh dengan mengubah nilai
parameter pattern menjadi bilangan biner. Dari contoh diatas diketahui nilai biner dari
5423 adalah 0000101011010000. Jika parameter factor bernilai 1, maka pattern yang
www.digizoneku.com
23
dimiliki adalah 5 piksel kosong, 1 piksel terisi, 1 piksel kosong,, 2 piksel terisi, 1
piksel kosong, 1 piksel terisi, 1 piksel kosong, 1 piksel terisi, dan 4 piksel kosong.
Namun pada contoh diatas parameter factor bernilai 3, maka argumen pattern bernilai
64 bit, berarti nilai pattern yang baru adalah sebagai berikut, 15 piksel kosong, 3
piksel terisi, 3 piksel kosong, 6 piksel terisi, 3 piksel kosong, 3 piksel terisi, 3 piksel
kosong, 3 piksel terisi, dan 12 piksel kosong.
4.2.3.3 Segitiga
Segitiga dibentuk dengan minimal 3 buah titik. Sintaks untuk membuat
segitiga pada OpenGL adalah
glBegin (GL_TRIANGLES);
glVertex3f(x1,y1,z1);
glVertex3f(x2,y2,z2);
glVertex3f(x3,y3,z3);
glEnd();
Contoh segitiga digambarkan pada gambar 4.16
www.digizoneku.com
24
www.digizoneku.com
25
4.2.3.5 Polygon
Polygon dapat dibentuk oleh lebih dari 4 buah titik. Sintaks untuk membuat poligon
pada OpenGL adalah
glBegin (GL_POLYGON);
glVertex3f(x1,y1,z1);
glVertex3f(x2,y2,z2);
glVertex3f(x3,y3,z3);
glVertex3f(x4,y4,z4);
glVertex3f(x5,y5,z5);
glEnd();
Contoh Polygon yang dibuat dengan menggunakan OpenGL ditunjukkan pada
gambar 2.18
glvertex3f(-5,2,0);
glvertex3f(1,4,0);
glvertex3f(5,-2,0);
glvertex3f(3,-5,0);
www.digizoneku.com
26
glvertex3f(6,2,0);
glend();
glFlush();
4.2.3.6 Kubus
Dalam OpenGL tidak ada perintah untuk membentuk kubus, sehingga untuk
membuatnya diperlukan titik-titik penyusun segi empat. Karena kubus terdiri dari 6
bangun segi empat, maka untuk mmbentuk kubus kita perlu meletakkan 24 titik
dimana masing-masing 4 titik akan membentuk bangun segi 4. Kubus yang dibuat
dengan OpenGL digambarkan pada gambar 2.19
glVertex3f( 1.0,
glVertex3f(-1.0,
1.0,
1.0,
1.0);
1.0);
glcolor3f{ungu}(0.2745,0.0039,0.2745);
glVertex3f(-1.0, -1.0, -1.0);
glVertex3f(-1.0, 1.0, -1.0);
glVertex3f( 1.0, 1.0, -1.0);
glVertex3f( 1.0, -1.0, -1.0);
glcolor3f{biru tua}(0.0157,0.047,0.6627);
glVertex3f(-1.0, 1.0, -1.0);
glVertex3f(-1.0, 1.0, 1.0);
glVertex3f( 1.0, 1.0, 1.0);
glVertex3f( 1.0, 1.0, -1.0);
www.digizoneku.com
27
glVertex3f(-1.0,
glVertex3f( 1.0,
glVertex3f( 1.0,
glVertex3f(-1.0,
-1.0, -1.0);
-1.0, -1.0);
-1.0, 1.0);
-1.0, 1.0);
glcolor3f{hijau}(0,0.686,0.192);
glVertex3f( 1.0, -1.0, -1.0);
glVertex3f( 1.0, 1.0, -1.0);
glVertex3f( 1.0, 1.0, 1.0);
glVertex3f( 1.0, -1.0, 1.0);
glcolor3f{pink}(0.976,0.604,0.961);
glVertex3f(-1.0, -1.0, -1.0);
glVertex3f(-1.0, -1.0, 1.0);
glcolor3f{kuning}(0.929,0.988,0.008);
glVertex3f(-1.0, 1.0, 1.0);
glVertex3f(-1.0, 1.0, -1.0);
glEnd();
glFlush();
Dari kode program diatas dapat diketahui bahwa kubus disusun oleh 6 bangun
persegi yang digunakan untuk menyusun kubus bagian depan, belakang, kanan, kiri,
atas, dan bawah.
4.2.3.7 Tabung
Tabung dibuat dengan memanfaatkan library pada OpenGL yang bernama
OpenGL Utility Library (GLU). Dengan GLU, tabung yang apabila dibuat dengan
OpenGL tidak dapat langsung dibuat, melainkan harus ditentukan masing-masing
titiknya, maka dengan GLU tabung dapat langsung dibuat. Sintaks untuk membuat
tabung adalah
www.digizoneku.com
28
4.2.3.8 Bola
Pembuatan bola pada OpenGL juga dibuat dengan menggunakan GLU.
Sintaks untuk membuat bola adalah
29
Contoh bola yang dibuat dengan menggunakan OpenGL ditunjukkan dengan gambar
2.21
www.digizoneku.com
30
Pada layar komputer yang berwarna, hardware tertentu telah membuat setiap
piksel padal layar terbagi menjai 3 warna yaitu merah, hijau dan biru yang bersatu
dengan intensitas yang berbeda-beda (Neider, 1997). Inilah yang akhirnya disebut
dengan warna RGB (red green blue). Pada OpenGL, setiap piksel menyimpan warna
merah, hjau dan biru dengan intensitas yang berbeda. Nilai yang dikandung oleh
masing-masing warna tersebut minimal 0 dan maksimal 1. Sintaks untuk menentukan
warna pada suatu objek pad OpenGL adalah
glColor3f (merah, hijau, biru: GLfloat);
Contoh pemberian warna pada objek segitiga ditunjukkan pada gambar 2.22
www.digizoneku.com
31
Pewarnaan objek pada OpenGL memungkinkan untuk dibuat berbeda pada setiap
titiknya, hasilnya akan diperoleh warna gradasi halus. Contoh pemakaian warna di
setiap titik pada bangun segitiga ditunjukkan pada gambar 2.23
Dari kode diatas dapat dilihat warna yang berbeda pada tiap-tiap titik, namun seperti
yang terlihat pada gambar 2.23, gabungan warna ini telah memberi warna gradasi
baru yang lebih indah.
4.2.5 Transformasi
Menurut Neider(1997), transformasi pada OpenGL dibedakan menjadi 3, yaitu
translasi, rotasi, dan penskalaan.
4.2.5.1 Translasi
Translasi adalah pemindahan suatu titik dari titik P=(x,y,z) ke posisi
P=(x,y,z) (Hearn, 1994) Pada OpenGL, translasi biasanya digunakan untuk
www.digizoneku.com
32
gltranslatef(x,y,z: GLfloat);
memindah pusat koordinat ke posisi yang baru. Sintaks untuk mentranslasikan objek
pada OpenGL adalah
Contoh objek yang ditranslasikan pada OpenGL ditunjukkan dengan gambar 2.24
Dari kode diatas diketahui bahwa posisi bola sebelum ditranslasikan berada
pada koorinat (0,0,0). Kemudian posisinya ditranslasikan sepanjang sumbu x sebesar
1 satuan dan sepanjang sumbu z sebesar 1 satuan. Dengan adanya proses
pentranslasian tersebut, maka pusat koordinat yang baru berada pada koordinat
(1,0,1).
4.2.5.2 Rotasi
Untuk merotasikan sebuah objek diperlukan sumbu rotasi (poros untuk merotasikan
objek) (Donald Hearn, 1994). Sintaks untuk merotasikan objek pada OpenGL adalah
www.digizoneku.com
33
gltranslatef(x,y,z: GLfloat);
Parameter pertama adalah nilai perputaran sudut. Parameter kedua , ketiga, dan
keempat bernilai 1 apabila sumbunya dijadikan sumbu putar. Contoh perotasian objek
ditunjukkan pada gambar 2.25
Tabung sebelum
dirotasi
Pada contoh diatas, diketahui bahwa posisi awal tabung sejajar dengan
sumbu z. Namun, setelah dirotasi sebesar -90 dengan sumbu putar x, posisi tabung
sejajar dengan sumbu y. Itu menunjukkan bahwa perotasian objek dengan sudut putar
positif akan berputar berlawanan dengan arah jarum jam, begitu pula sebaliknya, jika
sudut putar bernilai negatif, maka objek akan berputar searah dengan jarum jam.
4.2.5.3 Penskalaan
Transformasi skala adalah perubahan ukuran suatu objek (Sutopo, 2002).
Sintaks untuk untuk melakukan proses penskalaan dalam OpenGL adalah
glScalef(x,y,z:glFloat)
www.digizoneku.com
34
Ukuran Segitiga
yang sebenarnya
4.2.6 Proyeksi
Menurut Neide (1997), proyeksi pada OpenGL dibedakan menjadi 2 macam,
yaitu proyeksi perspektif dan proyeksi orthogonal.
www.digizoneku.com
35
36
Contoh pada gambar 2.28 akan membandingkan objek kubus yang dilihat pada
perspektif dengan sudut 45 dan 90.
Listing program untuk proyeksi perspektif kubus dengan sudut pandang 90 adalah
procedure reshape(w,h:integer);cdecl;
var ratio:real;
begin
if h=0 then h:=1;
ratio:=1*(w/h);
glMatrixMode(GL_PROJECTION);
glLoadIdentity();
glViewport(0,0,w,h);
gluPerspective(90,ratio,1,1000);
glMatrixMode(GL_MODELVIEW);
glLoadIdentity();
gluLookAt(-2,2,6, 0,0,-1, 0,1,0);
end;
www.digizoneku.com
37
Berdasarkan ilustrasi di atas, (left, bottom, -near) dan (right, top, -near) adalah
titik yang dekat dngan daerah cliping yang diposisikan di pojok kiri bawah dan pojok
atas kanan viewport. Sedangkan (left, bottom, -far) dan (right, top, -far) adalah titik
yang jauh dengan daerah clipping. Contoh pada gambar akan membandingkan objek
segitiga yang dilihat dengan proyeksi orthogonal.
www.digizoneku.com
38
Listing program untuk proyeksi orthogonal dengan nilai parameter left dan right sama
dengan 3 adalah
procedure reshape(w,h:integer);cdecl;
var ratio:real;
begin
glMatrixMode(GL_PROJECTION);
glLoadIdentity();
glViewport(0,0,w,h);
if (w <= h) then
glOrtho (-3, 3, -3*h/w,3*h/w, -20.0, 20.0)
else
glOrtho (-3*w/h,3*w/h, -3, 3, -20, 20);
glMatrixMode(GL_MODELVIEW);
glLoadIdentity();
end;
39
Programming Interface) juga sebagai sarana menginteraksikan objek tiga maupun dua
dimensi dengan input device pada komputer seperti keyboard.
4.3.1 Manajemen Window Dengan GLUT
Window untuk menampilkan objek yang dibuat dengan OpenGL dapat
diinisialisasikan dengan menggunakan GLUT. Berikut adalah sintaks yang digunakan
untuk menginisialisasikan window.
glutInit(Lib: TOpenGLLib);
GlutInit berfungsi untuk menginisialisasikan GLUT dan memproses perintah
GLUT lainnya. Perintah ini harus dipanggil sebelum perintah GLUT lainnya.
Setelah menginisialisasikan GLUT, selanjutnya kita mendefinisikan window, mulai
dari letak window pada layar dan ukurannya. Sintaks yang digunakan adalah
glutInitWindowPosition(x,y: integer)
Parameter x berfungsi untuk menentukan posisi window dari kiri layar,
sedangkan parameter y berfungsi untuk menentukan posisi window dari atas layar.
Selanjutnya, kita tentukan ukuran lebar dan tinggi window. Sintaks yang digunakan
adalah
glutInitWindowSize(width,height: integer)
Parameter width berfungsi untuk menentukan lebar window, sedangkan
parameter height berfungsi untuk menentukan tinggi window.
Setelah menentukan ukuran lebar dan tinggi window, perlu ditentukan model
display yang digunakan. Sintaks yang digunakan adalah
www.digizoneku.com
40
www.digizoneku.com
41
www.digizoneku.com
42
www.digizoneku.com
43