komputer grafik.docx

56
LAPORAN PRAKTIKUM KOMPUTER APLIKASI NAMA PRAKTIKAN NOMOR MAHASISWA TANGGAL KUMPUL TANDA TANGAN PRAKTIKAN Dicky Novri Suhanda 1214370153 NAMA PENILAI TANGGAL KOREKSI NILAI TANDA TANGAN DOSEN UNIVERSITAS PEMBANGUNAN PANCA BUDI FAKULTAS TEKNIK SISTEM KOMPUTER MEDAN 2014 KELAS TI 4 SORE

Upload: dickynovrisuhanda

Post on 19-Jan-2016

58 views

Category:

Documents


7 download

TRANSCRIPT

Page 1: KOMPUTER GRAFIK.docx

LAPORAN PRAKTIKUM

KOMPUTER APLIKASI

NAMA PENILAI

TANGGALKOREKSI

NILAI TANDA TANGAN DOSEN

UNIVERSITAS PEMBANGUNAN PANCA BUDIFAKULTAS TEKNIKSISTEM KOMPUTER

MEDAN 2014

BAB I

PENDAHULUAN

KELAS TI 4 SORE B

NAMA

PRAKTIKAN

NOMOR

MAHASISWA

TANGGAL

KUMPUL

TANDA TANGAN

PRAKTIKAN

Dicky Novri Suhanda

1214370153

Page 2: KOMPUTER GRAFIK.docx

1.1  Latar Belakang

Perkembangan grafika komputer menuntut para pengembang sistem aplikasi grafika komputer untuk dapat mengembangkan suatu informasi yang dilengkapi dengan visualisasi dan animasi, agar dapat lebih mudah dipahami oleh pihak yang menggunakan sistem tersebut. Grafika komputer telah menunjukkan kemajuan  yang pesat dalam pengembangan berbagai aplikasi untuk menghasilkan gambar. Grafika komputer digunakan untuk menunjang berbagai bidang dengan teknologi grafika berbasis komputer. Penggunaan grafika komputer telah lama digunakan dalam beberapa macam aplikasi, diantaranya pendidikan, kedokteran, fisika, matematika, multimedia, dan lain-lain. Pada saat ini grafika komputer 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 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. Dan makalah yang disampaikan kali ini khusus membahas mengenai perancangan bangun 3 dimensi menggunakan Visual Basic 6.0

1.2 Batasan Masalah

Batasan masalah pada perancangan bangun 3 Dimensi ini adalah :a. Penggambaran objek 3D didalam komputer.

b. Penerapan konsep transformasi menggunakan fungsi-fungsi dari OpenGL. c.  Pemrograman menggunakan bahasa Visual Basic 6.0

1.3 Tujuan

a. Menyelesaikan Ujian Akhir Semester mata  kuliah Grafika Komputer semester 6.b. Mahasiswa mampu menggampar objek 3 Dimensi menggunakan bahasa

pemrograman Visual Basic dan OpenGLc. Mahasiswa mampu mengimplementasikan fungsi transformasi 3D.

1.4 Sistematika Penulisan

Agar  makalah  dipahami  dengan  baik  oleh  pembaca,  maka  penyusun membuat sistematika penulisan makalah sebagai berikut :BAB I    PENDAHULUANPendahuluan berisikan latar belakang, identifikasi masalah, pembatasan masalah, Tujuan dibuatnya makalah dan sistematika penulisan makalah.

BAB II   LANDASAN TEORI

Page 3: KOMPUTER GRAFIK.docx

Landasan teori berisikan teori-teori yang digunakan didalam makalah.

BAB III PEMBAHASANPembuatan program untuk menggambar grafik 3D

BAB IV KESIMPULAN DAN SARANKesimpulan dan saran merupakan bab terakhir  yang berisikan tentang kesimpulan dari pembahasan serta pengajuan usulan atau saran-saran.

BAB II

LANDASAN TEORI

Page 4: KOMPUTER GRAFIK.docx

2.1 Definisi Objek 3 Dimensi

Obyek 3-D adalah sekumpulan titik-titik 3-D (x,y,z) yang membentuk luasan-luasan

(face) yang digabungkan menjadi satu kesatuan. Face adalah gabungan titik-titik

yang membentuk luasan tertentu atau sering dinamakan dengan sisi.

Sistem Koordinat 3 Dimensi

Page 5: KOMPUTER GRAFIK.docx

Contoh pernyataan Objek: Limas Segiempat

Titik-titik yang membentuk obyek:

Titik 0  (0,150,0)

Titik 1  (100,0,0)

Titik 2  (0,0,100)

Titik 3 (-100,0,0)

Titik 4  (0,0,-100)

2.2 Fungsi OpenGL 3D

1. Membersihkan Windows

Pada komputer, memory untuk menampilkan gambar biasanya diisi dengan

gambar yang berasal dari perintah gambar paling akhir, jadi perlu dibersihkan

dengan warna latar belakang sebelum digambar lagi. Contoh berikut ini

perintah yang digunakan untuk membersihkan layar latar belakang dengan

warna hitam dan buffer apa yang akan dibersihkan. Dalam hal ini, buffer warna

yang akan dibersihkan karena buffer warna merupakan tempat gambar

disimpan.

   glClearColor 0, 0, 0, 0

Page 6: KOMPUTER GRAFIK.docx

   glClear GL_COLOR_BUFFER_BIT Or GL_DEPTH_BUFFER_BIT

2. Spesifikasi Warna

Pada OpenGL mendeskripsikan objek dengan warna objek adalah proses yang

berjalan sendiri-sendiri. Sebelum warna diubah maka semua objek yang digambar

sesudah perintah tersebut akan menggunakan warna terakhir yang terdapat pada

coloring scheme. Untuk warna digunakan perintah glColor3f. Contoh berikut

menunjukkan urutan langkah dalam proses spesifikasi warna sebelum objek

digambar. Warna yang ditampilkan adalah warna merah.

glColor3f 1, 0, 0

3. Memaksa Proses Menggambar Sampai Selesai

Kebanyakan sistem grafik modern sudah menggunakan sistem graphics pipeline.

Dimana CPU utama memberikan issue perintah menggambar dan hardware lain

yang melakukan transformasi, clipping, shading, texturing dan lain-lain. Pada

arsitektur yang demikian, proses tidak dilakukan pada satu computer karena setiap

komputer mempunyai tugas sendiri. CPU utama tidak harus menunggu proses

pada masing-masing komputer tadi selesai, tapi bisa dengan memberikan issue

perintah gambar yang berikutnya. Untuk inilah OpenGL menyediakan perintah

glFlush yang memaksa client untuk segera mengirim paket network walaupun

belum penuh. Program sebaiknya ditulis menggunakan perintah ini karena glFlush

tidak memaksa proses gambar untuk selesai tetapi memaksa proses gambar untuk

segera dieksekusi, sehingga dijamin semua perintah gambar yang sebelumnya

akan segera dieksekusi dalam suatu waktu tertentu.

glFlush

Page 7: KOMPUTER GRAFIK.docx

4. Menggambar di Bidang Tiga Dimensi

Untuk menggambar grafik jenis apapun pada komputer biasanya dimulai dengan

pixel. Pixel adalah elemen terkecil dari layar monitor yang mempunyai atribut

warna dan posisi. Sedangkan untuk membentuk garis, poligon, objek dan lain-lain

dapat dilakukan melalui urutan pixel yang berbeda. Menggambar dengan

menggunakan OpenGL mempunyai perbedaan dengan bahasa lain, yaitu tidak

perlu memikirkan koordinat layar secara fisik tetapi hanya perlu

menspesifikasikan posisi koordinat dengan volume penglihatan. OpenGL

memikirkan sendiri bagaimana caranya menggambar titik, garis, dan lainnya yang

berada dalam ruang tiga dimensi ke gambar dua dimensi pada layar komputer.

Area gambar yang dibatasi ini adalah ruang koordinat kartesian yang mempunyai

range dari -100 hingga 100 untuk sumbu x, y dan z. Secara sederhana bidang ini

dapat dianggap sebagai bidang gambar untuk perintah-perintah OpenGL.

Untuk menggambar titik digunakan suatu perintah OpenGL yaitu : glVertex.

Fungsi ini dapat mempunyai 2 sampai 4 parameter dari berbagai macam tipe data.

Sebagai contoh perintah glVertex di bawah ini akan menspesifikasikan sebuah titik

pada posisi 4 sumbu x, 4 sumbu y dan 0 untuk sumbu z. glVertex3f 4, 4, 0. Setelah

diketahui cara untuk menspesifikasikan sebuah titik di ruang pada OpenGL.

Selanjutnya yang harus ditambahkan adalah informasi tambahan mengenai titik

tersebut, apakah titik tersebut akhir dari sebuah garis, atau merupakan sebuah titik

sudut dari sebuah poligon atau lainnya, karena definisi geometrik dari sebuah

vertex sebenarnya bukanlah hanya sebuah titik pada layar tetapi lebih merupakan

sebuah titik dimana terjadi interseksi antara dua buah garis atau kurva.

Page 8: KOMPUTER GRAFIK.docx

Primitif adalah interpretasi sejumlah set atau deretan titik pada sebuah bentuk

yang digambar pada layar. Pada OpenGL terdapat sepuluh macam primitif dari

mulai menggambar sebuah titik hingga poligon. Untuk itu digunakan perintah

glBegin sebagai cara memberitahu OpenGL untuk memulai menginterpretasi

sederetan titik sebagai salah satu bentuk primitif. Dan untuk mengakhiri deretan

titik ini digunakan perintah glEnd. Sebagai Contoh sebagai berikut :

glBegin bmPolygon // spesifikasikan titik sebagai primitif

glVertex3f 4, 4, 0 // spesifikasikan posisi titik

glEnd // mengakhiri perintah menggambar titik

5. Fungsi untuk keperluan Transformasi

a. Fungsi Translasi (Translation)

Translasi merupakan bentuk transformasi yang memindahkan posisi suatu

objek, baik pada sumbu x, sumbu y, atau sumbu z. Fungsi yang digunakan

untuk melakukan translasi adalah :

glTranslatef Tx, Ty, Tz

Parameter Tx digunakan untuk menentukan arah dan seberapa jauh suatu benda

akan dipindahkan berdasarkan sumbu x. Parameter Ty digunakan untuk

menentukan arah dan seberapa jauh suatu benda akan dipindahkan berdasarkan

sumbu y. Sedangkan parameter Tz digunakan untuk menentukan arah dan

seberapa jauh suatu benda akan dipindahkan berdasarkan sumbu z.

Contohnya :

glTranslatef 2, 2, 2

Page 9: KOMPUTER GRAFIK.docx

b. Fungsi Rotasi (Rotation)

Rotasi merupakan bentuk transformasi yang digunakan untuk memutar

posisisuatu benda. Fungsi yang digunakan untuk melakukan rotasi ialah

glRotatef(θ, Rx, Ry, Rz)

Parameter yang dibutuhkan pada fungsi tersebut ada 4 macam, yaitu parameter

θ untuk besar sudut putaran, parameter Rx untuk putaran berdasarkan sumbu x,

parameter Ry untuk putaran berdasarkan sumbu y, dan parameter Rz untuk

putaran berdasarkan sumbu z. Jika parameter θ bernilai postif, maka objek

akan diputar berlawanan arah jarum jam. Sedangkan jika parameter θ bernilai

negatif, maka objek akan diputar searah jarum jam. Contohnya :

glRotatef -30, 2, 2, 1

c. Fungsi Skala (Scalling)

Skalasi merupakan bentuk transformasi yang dapat mengubah ukuran (besar-

kecil) suatu objek. Fungsi yang digunakan untuk melakukan skalasi ialah :

glScalef(Sx, Sy, Sz)

Perubahan ukuran suatu objek diperoleh dengan mengalikan semua titik atau

atau vertex pada objek dengan faktor skala pada masing-masing sumbu

(parameter Sx untuk sumbu x, Sy untuk sumbu y, dan Sz untuk sumbu z).

Contohnya :

glScalef(2, 2, 2)

Page 10: KOMPUTER GRAFIK.docx

BAB III

PEMBAHASAN

1. Perancangan Form

Berikut ini adalah properties untuk masing-masing objek pada form di atas :

CommandButton :

(Name) : Command1

Caption : Tampilkan

TextBox :

(Name) : Text1

Page 11: KOMPUTER GRAFIK.docx

Caption : Aksi

HscrollBar1 :

(Name) : HScroll1

Min : -360

Max : 360

HscrollBar2 :

(Name) : HScroll2

Min : -360

Max : 360

HscrollBar3 :

(Name) : HScroll3

Min : -360

Max : 360

2. Perancangan Bangun 3D

Bangun 3D yang dibuat akan ditampilkan saat tombol “Tampilkan” ditekan.

Berikut tampilannya :

Page 12: KOMPUTER GRAFIK.docx

3.2.1 Script Pada Module

'VARIABEL BuatanPublic Type Titik3D   x As Single   y As Single   z As Single   geser As DoubleEnd Type

Mendaftarkan variabel yang digunakan.

Public Type Sisi   balok_atas(1 To 4) As Titik3D   balok_bawah(1 To 4) As Titik3D   balok_kanan(1 To 4) As Titik3D   balok_kiri(1 To 4) As Titik3D   balok_Depan(1 To 4) As Titik3D   balok_belakang(1 To 4) As Titik3D   

Page 13: KOMPUTER GRAFIK.docx

   prisma_bawah(1 To 4) As Titik3D   prisma_belakang(1 To 4) As Titik3D   prisma_kanan(1 To 4) As Titik3D   prisma_kiri(1 To 4) As Titik3D   prisma_depan(1 To 4) As Titik3D      tanah_bawah(1 To 4) As Titik3D   tanah_atas(1 To 4) As Titik3D   tanah_belakang(1 To 4) As Titik3D   tanah_depan(1 To 4) As Titik3D   tanah_kanan(1 To 4) As Titik3D   tanah_kiri(1 To 4) As Titik3D      pohon_atas(1 To 4) As Titik3D   pohon_bawah(1 To 4) As Titik3D   pohon_kanan(1 To 4) As Titik3D   pohon_kiri(1 To 4) As Titik3D   pohon_Depan(1 To 4) As Titik3D   pohon_belakang(1 To 4) As Titik3D      limas_kanan(1 To 4) As Titik3D   limas_kiri(1 To 4) As Titik3D   limas_Depan(1 To 4) As Titik3D   limas_belakang(1 To 4) As Titik3D      End Type

Mendaftarkan variabel yang digunakan.

Public balok As Sisi, prisma As Sisi, tanah As Sisi, pohon As Sisi, limas As Sisi

Mendaftarkan variabel yang digunakan.

Sub EnableOpenGL(ghDC As Long)

Dim pfd As PIXELFORMATDESCRIPTOR

Sub EnableOpenGL(ghDC As Long)digunakan untuk mengaktifkan fungsi OpenGL.

PIXELFORMATDESCRIPTOR merupakan sebuah struktur yang berisi data pixel format untuk menampilkan data pada layar.

Page 14: KOMPUTER GRAFIK.docx

ZeroMemory pfd, Len(pfd)pfd.nSize = Len(pfd)pfd.nVersion = 1pfd.dwFlags = PFD_DRAW_TO_WINDOW Or PFD_SUPPORT_OPENGL Or PFD_DOUBLEBUFFERpfd.iPixelType = PFD_TYPE_RGBApfd.cColorBits = 24pfd.cDepthBits = 32pfd.iLayerType = PFD_MAIN_PLANE

PixFormat = ChoosePixelFormat(ghDC, pfd)If PixFormat = 0 Then GoTo eeSetPixelFormat ghDC, PixFormat, pfdhrc = wglCreateContext(ghDC)wglMakeCurrent ghDC, hrc   

ChoosePixelFormat merupakan suatu fungsi yang digunakan OpenGL secara otomatis mencari device context terbaik yang dimiliki sekarang ini.

SetPixelFormat merupakan suatu fungsi yang digunakan untuk mengeset pixel format berdasarkan hasil function ChoosePixelFormat yang telah dilakukan sebelumnya.

Exit Subee: MsgBox ""   EndEnd Sub

Digunakan untuk menampilkan pesan/informasi kepada user.

Sub DisableOpenGL()   wglMakeCurrent 0, 0   wglDeleteContext hrcEnd Sub

wglMakeCurrent digunakan untuk memanggil rendering context dari OpenGL.

3.2.2 Script Pada Project

Sub Inisialisasi_Awal()'========== Inisialisasi ==========   EnableOpenGL Me.hDC

Page 15: KOMPUTER GRAFIK.docx

   hrc = wglCreateContext(hDC)   wglMakeCurrent hDC, hrc      'Inisilisasi Koordinat Bidang Dimensi-3   xmin = -30: xmax = 30   ymin = -30: ymax = 30   zmin = 30: zmax = -30   glOrtho xmin, xmax, ymin, ymax, zmin, zmax      glClearColor 0.4, 1, 0.3, 0   glClear GL_COLOR_BUFFER_BIT Or GL_DEPTH_BUFFER_BIT      glClear clrColorBufferBit   glMatrixMode GL_PROJECTION   glLoadIdentityEnd Sub

wglCreateContext merupakan fungsi OpenGL yang membuat rendering baru yang sesuai untuk menggambar sesuai dengan referenci hDC, dimana rendering context tersebut sama seperti pixel format yang telah diinisialisasi.

xmin = -30: xmax = 30 mendefinisikan range koordinat pada sumbu x. ymin = -30: ymax = 30 mendefinisikan range koordinat pada sumbu y. zmin = 30: zmax = -30 mendefinisikan range koordinat pada sumbu z.

glClearColor 0.4, 1, 0.3, 0 mendefinisikan warna dari windows yang dibuat dengan warna (0.4, 1, 0.3) yaitu abu-abu.

glClear GL_COLOR_BUFFER_BIT Or GL_DEPTH_BUFFER_BIT  untuk membersihkan memori buffer warna atau memori buffer kedalaman dari keadaan sebelumnya.

glMatrixMode GL_PROJECTION  berfungsi untuk memberi nilai masukan pada matrix dengan model projection.

glLoadIdentity untuk memanggil matriks terakhir yang disimpan.

Sub Bersihkan_Layar()   glClearColor 0.4, 1, 0.3, 0   glClear GL_COLOR_BUFFER_BIT Or GL_DEPTH_BUFFER_BITEnd Sub

Page 16: KOMPUTER GRAFIK.docx

Fungsinya telah dijelaskan pada script sebelumnya.

Sub Tampilkan_Gambar()   'Menampilkan Hasil   glFlush   SwapBuffers Me.hDCEnd Sub

 glFlush dan SwapBuffers Me.hDC adalah perintah yang digunakan untuk menampilkan gambar di layar.

Untuk menggambar objek :

glVertex3f(x,y,z) :  Lokasi titik berada di (x,y,z).  Tipe argumennya adalah float dan 3 dimensi yaitu x, y dan z

glColor3f(R, G, B) :  Warna latar muka (pena)  Tiga komponen warna yaitu Red, Green dan Blue

glBegin bmPOINTS :  Titik  

glBegin bmLINES :  Garis  

glBegin bmLINE_LOOP :  Poligaris tertutup (polygon)  

glBegin bmTRIANGLES :  Segitiga  

glBegin bmQUADS :  Segiempat  

glBegin bmPOLYGON :  Poligon  

glEnd :  Akhir perintah OpenGL  

Page 17: KOMPUTER GRAFIK.docx

1. Membuat objek bagian atas pohon

Terbentuk dari bangun Limas yang memiliki 5 sisi.

'titik 1 bagian belakang   limas.limas_belakang(1).x = -8   limas.limas_belakang(1).y = 5   limas.limas_belakang(1).z = 4      'titik 2 bagian belakang   With limas.limas_belakang(2)   .x = -2   .y = 7   .z = 4   End With      'titik 3 bagian belakang   With limas.limas_belakang(3)   .x = -5   .y = 15   .z = -1   End With Sub Membuat_Titik()

'====limas pohon====   'titik 1 bagian depan   limas.limas_Depan(1).x = -8   limas.limas_Depan(1).y = 5   limas.limas_Depan(1).z = -2      'titik 2 bagian depan   With limas.limas_Depan(2)   .x = -2   .y = 5   .z = -2   End With      'titik 3 bagian depan   With limas.limas_Depan(3)   .x = -5   .y = 15   .z = -1   End With      'titik 4 bagian depan   With prisma.prisma_depan(4)       .x = 0       .y = 8       .z = 2   End With      

Page 18: KOMPUTER GRAFIK.docx

   'titik 1 bagian kanan

   limas.limas_kanan(1).x = -2   limas.limas_kanan(1).y = 5   limas.limas_kanan(1).z = -2      'titik 2 bagian kanan   With limas.limas_kanan(2)   .x = -2   .y = 7   .z = 4   End With      'titik 3 bagian kanan   With limas.limas_kanan(3)   .x = -5   .y = 15   .z = -1   End With      'titik 1 bagian kiri   limas.limas_kiri(1).x = -8   limas.limas_kiri(1).y = 5   limas.limas_kiri(1).z = -2      'titik 2 bagian kiri   With limas.limas_kiri(2)   .x = -8   .y = 5   .z = 4   End With      'titik 3 bagian kiri   With limas.limas_kiri(3)   .x = -5   .y = 15   .z = -1   End With '=====limas pohon===       glColor3f 0, 0.5, 0       glBegin bmPolygon           For ttk = 1 To 3               With limas.limas_Depan(ttk)                   glVertex3f .x, .y, .z               End With           Next ttk       glEnd                        glColor3f 1, 1, 0.8

Page 19: KOMPUTER GRAFIK.docx

       glBegin bmPolygon           For ttk = 1 To 3               With limas.limas_kanan(ttk)                   glVertex3f .x, .y, .z               End With           Next ttk       glEnd                      glColor3f 0, 0.6, 0       glBegin bmPolygon           For ttk = 1 To 3               With limas.limas_kiri(ttk)                   glVertex3f .x, .y, .z               End With           Next ttk       glEnd                      glColor3f 0, 0.5, 0       glBegin bmPolygon           For ttk = 1 To 3               With limas.limas_belakang(ttk)                   glVertex3f .x, .y, .z               End With           Next ttk       glEndEnd Sub

Tampilan :

2. Membuat objek batang pohon

   'titik 3 bagian depan   With pohon.pohon_Depan(3)       .x = -4       .y = 5       .z = 0   End With      'titik 4 bagian depan   With pohon.pohon_Depan(4)       .x = -6       .y = 5       .z = 0   End With'====pohon====    'titik 1 bagian depan

Page 20: KOMPUTER GRAFIK.docx

 pohon.pohon_Depan(1).x = -6 pohon.pohon_Depan(1).y = 0 pohon.pohon_Depan(1).z = 0    'titik 2 bagian depan With pohon.pohon_Depan(2) .x = -4 .y = 0 .z = 0 End With

Terbentuk dari bangun balok, memiliki 6 sisi.

   'titik 1 bagian belakang   pohon.pohon_belakang(1).x = -6   pohon.pohon_belakang(1).y = 0   pohon.pohon_belakang(1).z = 2      'titik 2 bagian belakang   With pohon.pohon_belakang(2)   .x = -4   .y = 0   .z = 2   End With      'titik 3 bagian belakang   With pohon.pohon_belakang(3)       .x = -4       .y = 5       .z = 2   End With      'titik 4 bagian belakang   With pohon.pohon_belakang(4)       .x = -6       .y = 5       .z = 2   End With      'titik 1 bagian atas   pohon.pohon_atas(1).x = -6

Page 21: KOMPUTER GRAFIK.docx

   pohon.pohon_atas(1).y = 5   pohon.pohon_atas(1).z = 0      'titik 2 bagian atas   With pohon.pohon_atas(2)   .x = -4   .y = 5   .z = 0   End With      'titik 3 bagian atas   With pohon.pohon_atas(3)       .x = -4       .y = 5       .z = 2   End With'titik 1 bagian bawah   pohon.pohon_bawah(1).x = -6   pohon.pohon_bawah(1).y = 0   pohon.pohon_bawah(1).z = 0      'titik 2 bagian bawah   With pohon.pohon_bawah(2)   .x = -4   .y = 0   .z = 0   End With      'titik 3 bagian bawah   With pohon.pohon_bawah(3)       .x = -4       .y = 0       .z = 0   End With      'titik 4 bagian bawah   With pohon.pohon_bawah(4)       .x = -6       .y = 0       .z = 2   End With

   'titik 1 bagian kanan   pohon.pohon_kanan(1).x = -4   pohon.pohon_kanan(1).y = 0   pohon.pohon_kanan(1).z = 0      'titik 2 bagian kanan   With pohon.pohon_kanan(2)   .x = -4   .y = 0   .z = 2   End With      'titik 3 bagian kanan   With pohon.pohon_kanan(3)       .x = -4

Page 22: KOMPUTER GRAFIK.docx

       .y = 5       .z = 2   End With      'titik 4 bagian kanan   With pohon.pohon_kanan(4)       .x = -4       .y = 5       .z = 0   End With     

glColor3f 0.5, 0.3, 0glBegin bmPolygon    or ttk = 1 To 4

With pohon.pohon_kanan(ttk)    glVertex3f .x, .y, .z               End With           Next ttk       glEndglColor3f 0.5, 0.3, 0       glBegin bmPolygon           For ttk = 1 To 4               With pohon.pohon_kiri(ttk)       glVertex3f .x, .y, .z

Page 23: KOMPUTER GRAFIK.docx

               End With           Next ttk       glEnd glColor3f 0.4, 0.2, 0       glBegin bmPolygon           For ttk = 1 To 4               With pohon.pohon_belakang(ttk)        glVertex3f .x, .y, .z               End With           Next ttk       glEnd       '====pohon===

glColor3f 1, 0.8, 0glBegin bmPolygon   For ttk = 1 To 4       With pohon.pohon_bawah(ttk)glVertex3f .x, .y, .z       End With           Next ttk       glEnd

glColor3f 1, 0, 0.3glBegin bmPolygon  For ttk = 1 To 4     With pohon.pohon_atas(ttk)glVertex3f .x, .y, .z     End With           Next ttk       glEnd

glColor3f 0.4, 0.2, 0glBegin bmPolygon     For ttk = 1 To 4       With pohon.pohon_Depan(ttk)  glVertex3f .x, .y, .z               End With           Next ttk       glEnd                        

             

Page 24: KOMPUTER GRAFIK.docx

Tampilan :

Page 25: KOMPUTER GRAFIK.docx

3. Membuat objek atap rumah

Terbentuk dari bangun prisma yang memiliki 5 sisi

'======PRISMA======'titik 1 bagian depan

   prisma.prisma_depan(1).x = 0   prisma.prisma_depan(1).y = 5   prisma.prisma_depan(1).z = -3 'titik 2 bagian depan   With prisma.prisma_depan(2)   .x = 10   .y = 5   .z = -3   End With      'titik 3 bagian depan   With prisma.prisma_depan(3)       .x = 10       .y = 8       .z = 2   End With        'titik 4 bagian depan   With prisma.prisma_depan(4)       .x = 0       .y = 8       .z = 2   End With   

'titik 1 bagian belakang   prisma.prisma_belakang(1).x = 0   prisma.prisma_belakang(1).y = 5   prisma.prisma_belakang(1).z = 7      'titik 2 bagian belakgn   With prisma.prisma_belakang(2)   .x = 10   .y = 5   .z = 7   End With      'titik 3 bagian belakng   With prisma.prisma_belakang(3)       .x = 10

Page 26: KOMPUTER GRAFIK.docx

       .y = 8       .z = 2   End With      'titik 4 bagian belakng   With prisma.prisma_belakang(4)       .x = 0       .y = 8       .z = 2   End With

'titik 1 bagian kanan   prisma.prisma_kanan(1).x = 10   prisma.prisma_kanan(1).y = 5   prisma.prisma_kanan(1).z = -3      'titik 2 bagian kanan   With prisma.prisma_kanan(2)   .x = 10   .y = 5   .z = 7   End With      'titik 3 bagian kanan   With prisma.prisma_kanan(3)       .x = 10       .y = 8       .z = 2   End With

'titik 1 bagian kiri   prisma.prisma_kiri(1).x = 0   prisma.prisma_kiri(1).y = 5   prisma.prisma_kiri(1).z = -3      'titik 2 bagian kiri   With prisma.prisma_kiri(2)   .x = 0   .y = 5   .z = 7   End With      'titik 3 bagian kiri   With prisma.prisma_kiri(3)       .x = 0       .y = 8       .z = 2   End With       'titik 1 bagian bawah   prisma.prisma_bawah(1).x = 0   prisma.prisma_bawah(1).y = 5   prisma.prisma_bawah(1).z = -3      'titik 2 bagian bawah   With prisma.prisma_bawah(2)   .x = 10   .y = 5   .z = -3

Page 27: KOMPUTER GRAFIK.docx

   End With      'titik 3 bagian bawah   With prisma.prisma_bawah(3)       .x = 10       .y = 5       .z = 7   End With       .z = 7   End With

      glColor3f 0, 0.5, 1

       glBegin bmTriangles           For ttk = 1 To 3               With prisma.prisma_kiri(ttk)                   glVertex3f .x, .y, .z               End With           Next ttk       glEnd

        glColor3f 0, 0.1, 0.9       glBegin bmPolygon           For ttk = 1 To 4               With prisma.prisma_belakang(ttk)                   glVertex3f .x, .y, .z               End With           Next ttk       glEnd

'titik 4 bagian bawah   With prisma.prisma_bawah(4)       .x = 0       .y = 5

 glColor3f 1, 0.8, 0   glBegin bmPolygon      For ttk = 1 To 4        With prisma.prisma_bawah(ttk) glVertex3f .x, .y, .z               End With           Next ttk       glEnd

           glColor3f 1, 1, 1       glBegin bmTriangles           For ttk = 1 To 3               With prisma.prisma_kanan(ttk)                   glVertex3f .x, .y, .z               End With           Next ttk       glEnd

           glColor3f 0, 0.4, 1

Page 28: KOMPUTER GRAFIK.docx

       glBegin bmPolygon           For ttk = 1 To 4               With prisma.prisma_depan(ttk)                   glVertex3f .x, .y, .z               End With           Next ttk       glEnd

4. Membuat objek dinding rumah

Terbentuk dari  bangun balok yang memiliki 6 sisi.

'titik 1 bagian belakangbalok.balok_belakang(1).x = 10balok.balok_belakang(1).y = 0balok.balok_belakang(1).z = 4      'titik 2 bagian belakang   With balok.balok_belakang(2)   .x = 0   .y = 0   .z = 4   End With      'titik 3 bagian belakang

Page 29: KOMPUTER GRAFIK.docx

   With balok.balok_belakang(3)       .x = 0       .y = 5       .z = 4   End With      'titik 4 bagian belakang   With balok.balok_belakang(4)       .x = 10       .y = 5       .z = 4   End With'=======BALOK===========

   'titik 1 bagian depan   balok.balok_Depan(1).x = 0   balok.balok_Depan(1).y = 0   balok.balok_Depan(1).z = 0      'titik 2 bagian depan   With balok.balok_Depan(2)   .x = 10   .y = 0   .z = 0   End With      'titik 3 bagian depan   With balok.balok_Depan(3)       .x = 10       .y = 5       .z = 0   End With

   'titik 4 bagian depan   With balok.balok_Depan(4)       .x = 0       .y = 5       .z = 0   End With

   'titik 1 bagian kanan   balok.balok_kanan(1).x = 10   balok.balok_kanan(1).y = 0   balok.balok_kanan(1).z = 0      'titik 2 bagian kanan   With balok.balok_kanan(2)   .x = 10   .y = 0   .z = 4   End With      'titik 3 bagian kanan   With balok.balok_kanan(3)

Page 30: KOMPUTER GRAFIK.docx

       .x = 10       .y = 5       .z = 4   End With   'titik 4 bagian kanan   With balok.balok_kanan(4)       .x = 10       .y = 5       .z = 0   End With       'titik 1 bagian kiri   balok.balok_kiri(1).x = 0   balok.balok_kiri(1).y = 0   balok.balok_kiri(1).z = 0      'titik 2 bagian kiri   With balok.balok_kiri(2)   .x = 0   .y = 0   .z = 4   End With      'titik 3 bagian kiri   With balok.balok_kiri(3)       .x = 0       .y = 5       .z = 4   End With      'titik 4 bagian kiri   With balok.balok_kiri(4)       .x = 0       .y = 5       .z = 0   End With   'titik 1 bagian atas   balok.balok_atas(1).x = 0   balok.balok_atas(1).y = 5   balok.balok_atas(1).z = 0      'titik 2 bagian atas   With balok.balok_atas(2)   .x = 10   .y = 5   .z = 0   End With      'titik 3 bagian atas   With balok.balok_atas(3)       .x = 10       .y = 5       .z = 4   End With      'titik 4 bagian atas   With balok.balok_atas(4)       .x = 0       .y = 5       .z = 4   End With

Page 31: KOMPUTER GRAFIK.docx

   'titik 1 bagian bawah   balok.balok_bawah(1).x = 0   balok.balok_bawah(1).y = 0   balok.balok_bawah(1).z = 0      'titik 2 bagian bawah   With balok.balok_bawah(2)   .x = 10   .y = 0   .z = 0   End With      'titik 3 bagian bawah   With balok.balok_bawah(3)       .x = 10       .y = 0       .z = 4   End With   

'=====balok======

glColor3f 1, 0.8, 0glBegin bmPolygon  For ttk = 1 To 4    With balok.balok_bawah(ttk)                   glVertex3f .x, .y, .zEnd With       Next ttk       glEnd

glColor3f 1, 0, 0.3glBegin bmPolygonFor ttk = 1 To 4    With balok.balok_atas(ttk)                   glVertex3f .x, .y, .z

Page 32: KOMPUTER GRAFIK.docx

End With     Next ttk       glEnd

glColor3f 1, 0.8, 0glBegin bmPolygon      For ttk = 1 To 4         With balok.balok_Depan(ttk)                   glVertex3f .x, .y, .zEnd With  Next ttk       glEnd

                   glColor3f 1, 1, 0glBegin bmPolygon  For ttk = 1 To 4      With balok.balok_kanan(ttk)                   glVertex3f .x, .y, .zEnd With  Next ttk       glEnd

glColor3f 1, 1, 0       glBegin bmPolygon           For ttk = 1 To 4               With balok.balok_kiri(ttk)                   glVertex3f .x, .y, .z               End With           Next ttk       glEnd

glColor3f 1, 0.8, 0       glBegin bmPolygon           For ttk = 1 To 4               With balok.balok_belakang(ttk)                   glVertex3f .x, .y, .z               End With           Next ttk       glEnd

Page 33: KOMPUTER GRAFIK.docx

Tampilan :

5. Membuat objek tanah

Terbentuk dari balok yang memiliki 6 sisi.

   '=============balok tanah=====       'titik 1 bagian depan   tanah.tanah_depan(1).x = -8   tanah.tanah_depan(1).y = 0   tanah.tanah_depan(1).z = 0      'titik 2 bagian depan   With tanah.tanah_depan(2)   .x = -8   .y = -2

Page 34: KOMPUTER GRAFIK.docx

   .z = 0   End With      'titik 3 bagian depan   With tanah.tanah_depan(3)       .x = 18       .y = -2       .z = 0   End With      'titik 4 bagian depan   With tanah.tanah_depan(4)       .x = 18       .y = 0       .z = 0   End With

    'titik 1 bagian belakang   tanah.tanah_belakang(1).x = -8   tanah.tanah_belakang(1).y = 0   tanah.tanah_belakang(1).z = 8      'titik 2 bagian belakang   With tanah.tanah_belakang(2)   .x = -8   .y = -2   .z = 8   End With      'titik 3 bagian belakang   With tanah.tanah_belakang(3)       .x = 18       .y = -2       .z = 8   End With      'titik 4 bagian belakang   With tanah.tanah_belakang(4)       .x = 18       .y = 0       .z = 8   End With

   'titik 1 bagian atas  tanah.tanah_atas(1).x = -8   tanah.tanah_atas(1).y = 0   tanah.tanah_atas(1).z = 0      'titik 2 bagian atas   With tanah.tanah_atas(2)   .x = 18

Page 35: KOMPUTER GRAFIK.docx

   .y = 0   .z = 0   End WithglColor3f 1, 0.6, 0glBegin bmPolygonFor ttk = 1 To 4With tanah.tanah_kanan(ttk)glVertex3f .x, .y, .zEnd WithNext ttkglEnd

glColor3f 1, 0.8, 0glBegin bmPolygonFor ttk = 1 To 4With tanah.tanah_bawah(ttk)glVertex3f .x, .y, .zEnd WithNext ttkglEnd

glColor3f 0.2, 0.2, 0.2glBegin bmPolygonFor ttk = 1 To 4With tanah.tanah_depan(ttk)glVertex3f .x, .y, .zEnd WithNext ttkglEnd

glColor3f 0.5, 0, 0glBegin bmPolygonFor ttk = 1 To 4With tanah.tanah_belakang(ttk)glVertex3f .x, .y, .zEnd WithNext ttkglEnd

glColor3f 0.7, 0, 0glBegin bmPolygonFor ttk = 1 To 4With tanah.tanah_kiri(ttk)glVertex3f .x, .y, .zEnd WithNext ttkglEnd

glColor3f 1, 0, 0.3glBegin bmPolygonFor ttk = 1 To 4With tanah.tanah_atas(ttk)glVertex3f .x, .y, .zEnd WithNext ttkglEnd

Page 36: KOMPUTER GRAFIK.docx

Tampilan :

Jika seluruh scrip diatas kita gabungkan, maka keseluruhan objek berbentuk rumah akan tampil, sebagai berikut :

Page 37: KOMPUTER GRAFIK.docx

1. Membuat Transformasi Objek

1. Rotasi

a. Berdasarkan sumbu-X

Private Sub HScroll1_Change()Call Bersihkan_Layar   '=====================================   glRotatef HScroll1.Value, 1, 0, 0      Call Tampilkan_Data   '===========================   Call Tampilkan_GambarEnd Sub

Script diatas diletakkan pada HScroll1.

Fungsi ini digunakan digunakan untuk memutar posisi objek berdasarkan sumbu-X.

glRotatef HScroll1.Value, 1, 0, 0. Maksudnya adalah besar sudut putaran ditentukan oleh nilai pada HScroll1. Karena Scroll ini digunakan untuk

Page 38: KOMPUTER GRAFIK.docx

memutar objek berdasarkan sumbu-X saja, maka putaran berdasarkan sumbu x bernilai 1, sedangkan berdasarkan sumbu y dan sumbu z adalah 0.Tampilan Objek setelah dirotasi berdasarkan sumbu-X :

b. Berdasarkan sumbu-Y

Private Sub HScroll2_Change()Call Bersihkan_Layar   '=====================================   glRotatef HScroll2.Value, 0, 1, 0      Call Tampilkan_Data   '===========================   Call Tampilkan_Gambar

End Sub

Script diatas diletakkan pada HScroll2.

Fungsi ini digunakan digunakan untuk memutar posisi objek berdasarkan sumbu-Y.

glRotatef HScroll2.Value, 0, 1, 0. Maksudnya adalah besar sudut putaran ditentukan oleh nilai pada HScroll2. Karena Scroll ini digunakan untuk

Page 39: KOMPUTER GRAFIK.docx

memutar objek berdasarkan sumbu-Y saja, maka putaran berdasarkan sumbu x dan sumbu z bernilai 0, sedangkan berdasarkan sumbu y bernilai 1.Tampilan Objek setelah dirotasi berdasarkan sumbu-Y :

c. Berdasarkan sumbu-Z

Private Sub HScroll3_Change()Call Bersihkan_Layar   '=====================================   glRotatef HScroll2.Value, 0, 0, 1      Call Tampilkan_Data   '===========================   Call Tampilkan_Gambar

End Sub

Script diatas diletakkan pada HScroll3.

Fungsi ini digunakan digunakan untuk memutar posisi objek berdasarkan sumbu-Z.

glRotatef HScroll2.Value, 0, 0, 1. Maksudnya adalah besar sudut putaran ditentukan oleh nilai pada HScroll3. Karena Scroll ini digunakan untuk

Page 40: KOMPUTER GRAFIK.docx

memutar objek berdasarkan sumbu-Z saja, maka putaran berdasarkan sumbu x dan sumbu y bernilai 0, sedangkan berdasarkan sumbu z bernilai 1.Tampilan Objek setelah dirotasi berdasarkan sumbu-Z :

2. Translasi

a. Ke arah kiri

Private Sub Text1_KeyPress(KeyAscii As Integer)'GESER Kiri   If KeyAscii = 120 Then       Call Bersihkan_Layar       '=====================================              glTranslatef 1 / 10, 0, 0                     Call Tampilkan_Data       '===========================       Call Tampilkan_Gambar          End If

Page 41: KOMPUTER GRAFIK.docx

glTranslatef 1 / 10, 0, 0 Digunakan  untuk memindahkan posisi objek berdasarkan sumub-X ke arah kiri, yJaitu bernilai 1. Nilai 10 menunjukkan seberapa jauh objek dipindahkan pada sumbu-X.

fungsi translasi ini akan berfungsi jika pada objek Text pada form diberi inputan berupa huruf  “z” yang pada KeyAscii nya adalah 120.

Tampilan objek setelah ditranslasi ke kiri :

b. Ke arah kanan

If KeyAscii = 122 Then       Call Bersihkan_Layar       '=====================================       'glRotatef HScroll2.Value, 0, 1, 0       glTranslatef -1 / 10, 0, 0

       Call Tampilkan_Data       '===========================       Call Tampilkan_Gambar   End If   

Page 42: KOMPUTER GRAFIK.docx

glTranslatef -1 / 10, 0, 0 Digunakan  untuk memindahkan posisi objek berdasarkan sumub-X ke arah kanan, yaitu bernilai 1. Nilai 10 menunjukkan seberapa jauh objek dipindahkan pada sumbu-X.

fungsi translasi ini akan berfungsi jika pada objek Text pada form diberi inputan berupa huruf  “x” yang pada KeyAscii nya adalah 122.

Tampilan objek setelah ditranslasi ke kanan :

3. Skala

a. Memperbesar

If KeyAscii = 99 Then       Call Bersihkan_Layar       '=====================================      glScalef 1.05, 1.05, 1.05

       Call Tampilkan_Data       '===========================

Page 43: KOMPUTER GRAFIK.docx

       Call Tampilkan_Gambar   End If

glScalef 1.05, 1.05, 1.05 Digunakan  untuk mengubah ukuran objek menjadi lebih besar sebesar 0.05x dari ukuran semula.

fungsi translasi ini akan berfungsi jika pada objek Text pada form diberi inputan berupa huruf  “c” yang pada KeyAscii nya adalah 99.

Tampilan objek setelah skalanya di perbesar  :

b. Memperkecil

 If KeyAscii = 118 Then       Call Bersihkan_Layar       '=====================================      glScalef 0.95, 0.95, 0.95

       Call Tampilkan_Data

Page 44: KOMPUTER GRAFIK.docx

       '===========================       Call Tampilkan_Gambar   End If

glScalef 0.05, 0.05, 0.05 Digunakan  untuk mengubah ukuran objek menjadi lebih kecil sebesar 0.05x dari ukuran semula.

Fungsi translasi ini akan berfungsi jika pada objek Text pada form diberi inputan berupa huruf  “v” yang pada KeyAscii nya adalah 118.

Tampilan objek setelah skalanya di perkecil  :

Page 45: KOMPUTER GRAFIK.docx

BAB IVKESIMPULAN DAN SARAN

4.1 Kesimpulan     Dari pembahasan dapat  diambil kesimpulan sebagai berikut :

1.  Didalam pembuatan grafik di jaman serba teknologi ini kita bebas menentukan alat apa yang akan kita pakai, dan untuk memahami secara mendalam transformasi didalam grafik komputer sangatlah penting menguasai ilmu matematik.

2.  Perbandingan  hasil  pembuatan  program  dengan  menggunakan bahasa programan lebih sulit dan  berbeda jauh dari segi tampilan, maupun tata cara pembuatannya dibandingkan dengan program aplikasi yang menerapkan system just click (event driven).

4.2 Saran

Setelah melihat uraian di atas, penyusun mempunyai saran.

1. Terlebih dahulu harus belajar algoritma, karena algorima adalah salah satu kunci untuk dapat memahami permasalahan yang akan dihadapi didalam pembuatan grafik komputer.

2.  Bila ingin membuat suatu gambar/grafik, pilihlah program aplikasi yang lebih bagus menurut anda, lebih kompleks, dan yang khusus menanganipembuatan gambar/grafik    serta    yang    mengikuti perkembangan jaman .

3. Harus memahami sintak-sintak (gaya bahasa penulisan dalam bahasa pemrograman ) yang terdapat dalam bahasa pemrograman ataupun fitur – fitur yang terdapat didalam program aplikasi.