Professional Documents
Culture Documents
Handouts
Grafika Komputer
Handouts
Grafika Komputer
Edisi I
Diterbitkan oleh:
Badan Penerbit
Sekolah Tinggi Manajemen Informatika dan Komputer
AKAKOM Yogyakarta
Citra / raster
Citra akan berubah bentuknya jika diubah ukurannya diberbersar atau
diperkecil. Perubahan bentuk Pada citra terjadi karena ukuran pixel
mengikuti perbandingan perbesaran citra. Sehingga perbesaran
mengakibatkan citra kehilangan ketajaman.
Aplikasi pengolah Citra daoat digunakan untukmemberikan efek khusu
terhadap citra yang diolah, tergantung aplikas yang digunakan dapat
diberkan efek khusu seperti bayangan (shadow), pengkaburan (blur)
dsb.
Contoh aplikas pengolah Citra antara lain Corel PhotoPaint, Adobe
Photoshope
1.1.2 Presentasi
Aplikasi presentasi banyak digunakan oleh kalangan bisnis dalam
mempresentaskan ide-ide ataupun konsep-konsep. Dalam
perkembangannya, aplikas presentas tidak hanya sekedar menampilkan slide
ke layar tetapi juga dilengkapi dengan fasilitas animasi. (contoh aplikasi
presentasi antara lain : Power point, Marcomedia Flash)
1.1.4 Animasi
Aplikasi animasi merupakan aplikas yang banyak digunakan dalam
bidang periklanan dan Film. Dengan mengunakan aplikasi animasi, seorang
kreator dapat menciptakan benda-benda maya yang dapat bergerak dalam
dunia nyata. Contoh aplikasi animasi antara lain Autodesk 3D Studio,
Extreme 3D, Animator Pro, Ray Dream Studio.
1.1.6 Permainan
Saat ini hampir tidak ada aplikas permainan komputer yang tiak
memanfaatkan modus grafik. Aplikasi permainan antara lain aplikasi tembak
dan lari (Shoot adn run), Aplikasi permainan strategi (war games), dll.
Kode :
Canvas->MoveTo(x0, y0);
Canvas->MoveTo(x1, y1);
...
Canvas->LineTo(xn, yn)
Garis ini berawal dari titik koordinat (x0,y0) sampai ke (x1,y1) dan
selanjutnya ke (xn,yn).
X0,y0 X2,y2
Xn,yn
X1,y1
Contoh
3. Kotak (Box)
Kotak merupakan siklus tertutup minimal memiliki 2 titik pokok
X1,y1
X2,y2
Keterangan :
X1,y1:koordinat kotak awal
X2,y2:koordinat kotak akhir (diagonal)
4. Lingkaran/Elip (Circle/Ellipse)
X2,y2 X2,y2
Lingkaran Elip
5. Busur (Arc)
Digunakan untuk mengambar bagaian dari lingkaran yaitu membuat
busur.
Canvas->Arc(x1, y1, x2, y2, x3, y3, x4, y4);
x3,y3
x1,y1
X4,y4
X2,y2
X3,y3
X1,y1
X4,y4
X2,y2
7. Pie/Juring
Digunakan untuk mengambar bagaian dari lingkaran yaitu membuat
Juring.
X3,y3
X1,y1
X4,y4
X2,y2
8. Poligon (Polygon)
Method Poligon digunakan untuk mengambar segi banyak
Gambar yang terbentuk adalah kurva tertutup.
Contoh :
POINT titik[4]
Titik[0]=POINT(10,10); a
Titik[1]=POINT(100,10); b
Titik[2]=POINT(150,100);c
Titik[3]=POINT(50,150);d
Titik[4]=POINT(0,50); e
Canvas->Polygon((Tpoint*) titik,4);
Hasil:
a b
9. Polyline
Polyline digunakan untuk membuat ”satu” atau ”banyak” garis dari
suatu koordinat ke koordinat lainnya.
Contoh :
POINT titik[4]
Titik[0]=point(10,10); a
Titik[1]=point(100,10); b
Titik[2]=point(150,100);c
Titik[3]=point(50,150);d
Titik[4]=point(0,50); e
Canvas->Polyline((Tpoint*) titik,4);
Hasil:
a b
1. Atribut Garis
Atribut dasar untuk garis lurus adalah style (tipe garis), width (tebal)
dan color(warna).
Dalam beberapa paket aplikasi grafik, garis dapat ditampilkan dengan
mengunakan Pen.
2. Atribut Kurva
Parameter untuk atribut kurva sama dengan atribut segmen garis.
Kurva dapat ditampilkan dengan berbagai warna, tebal, dot-dash(Style
garis) dan pilihan pen atau brush. Selain itu untuk pengisian suatu
bidang tertentu termasuk memilih warna antara solid dan pattern
tertentu dan memilih warna pattern yang ada.
3. Atribut Karakter
Kode Program
//--------------------------------------#include <vcl.h>
#pragma hdrstop
#include "Umobil.h"
//---------------------------------------------#pragma
package(smart_init)
#pragma resource "*.dfm"
TForm1 *Form1;
//---------------------------------------------__fastcall
TForm1::TForm1(TComponent* Owner)
: TForm(Owner)
{
}
//---------------------------------------------void __fastcall
TForm1::FormPaint(TObject *Sender)
{
Canvas->Brush->Color = clYellow;
Canvas->Rectangle(0,0,650,300);
Canvas->Brush->Color = clGray;
Canvas->Rectangle(0,300,650,500);
Canvas->MoveTo(200,200);
Canvas->Brush->Color = clBlue;
POINT Titik[13];
Titik[0]=Point(260,170);
Canvas->Polygon((TPoint*) Titik,13);
Canvas->Brush->Color = clBlack;
Canvas->Pen->Width = 14;
Canvas->Brush->Style = bsCross;
Canvas->Ellipse(450,315, 510, 390);
Canvas->Ellipse(230,315, 290, 390);
Canvas->Brush->Color = clRed;
Canvas->Brush->Style = bsSolid;
Canvas->Pen->Width = 5;
POINT Jendela[3];
Jendela[0]=Point(250,250);
Jendela[1]=Point(265,180);
Jendela[2]=Point(515,180);
Jendela[3]=Point(530,250);
Canvas->Polygon((TPoint*) Jendela,3);
Canvas->MoveTo(330,180);
Canvas->LineTo(330,250);
Canvas->MoveTo(400,180);
Canvas->LineTo(400,250);
Canvas->MoveTo(470,180);
Canvas->LineTo(470,250);
}
//---------------------------------------------------------------------
------
Langkah 3
Buka File Upen.h (ctrl-F6) dan deklarasikan fungsi-fungsi berikut pada
bagian public
void _fastcall BersihkanCanvas();
void _fastcall SetDefault();
Langkah 4
Buka File Upen.cpp dan definisikan fungsi-fungsi tersebut pada bagain
akhir kode program dengan menggunakan sintak berikut
Langkah 5
Isikan sintak berikut pada event OnClick pada item “Style” dari
komponen MainMenu1.
void __fastcall TForm1::Style1Click(TObject *Sender)
{
//membuat 7 element array dari tipe TPenStyle
TPenStyle JENIS[7] = { psSolid, psDash, psDot, psDashDot,
psDashDotDot, psClear, psInsideFrame };
int posisiY = 20; //deklarasi posisiY dengan nilai awal 20
Sampai disini, coba jalankan aplikas dan pilih menu Style, kita akan
melihat hasil seperti berikut
Langkah 6
Selanjutnya isikan sintak berikut pada event OnClick pada item ”Color”
dari komponen MainMenu1
Coba jalankan aplikasi tersebut. Pilih Menu Color. Hasil aplikasi akan
tampak sebagai berikut
Langkah 7
Isikan Sintak dibawah ini untuk Event Onclick pada item ”Width” dari
Komponen MainMenu1
Jalankan aplikasi dan pilih menu Width, kita akan mendapatkan hasil
sebagai berikut
2. Mengenal Brush
Langkah 1
Buat aplikasi baru simpan untuk File Unit dengan nama Ubrush.cpp
dan untuk File Project Brush.bpr. Kemudian menu dari komponen
TmainMenu tambahan Menu dengan Caption ”&Brush” dan submenu
dengan Caption ”Style”
Langkah 2
Buka File Ubrush.h dan deklarasikan fungsi BersihkanCanvas pada
Bagian Public
void _fastcall BersihkanCanvas();
Langkah 3
Isikan sintak berikut untuk event OnClick pada item ”Style” dari
komponen MainMenu1 sebagai berikut
//---------------------------------------------------------------------
------
Canvas->TextOut(10,110, "bsClear");
Canvas->TextOut(120,110, "bsSolid");
Canvas->TextOut(240,110, "bsCrosh");
Canvas->TextOut(360,110, "bsBDiagonal");
Canvas->TextOut(10,250, "bsFDiagonal");
Canvas->TextOut(120,250, "bsDiagCross");
Canvas->TextOut(240,250, "bsHorizantal");
Canvas->TextOut(360,250, "bsVertical");
Canvas->Brush->Style = bsClear;
Canvas->Rectangle(10,10,100,100);
Canvas->Brush->Color = clRed;
Canvas->Brush->Style = bsSolid;
Canvas->Brush->Color = clBlue;
Canvas->Rectangle(120, 10, 220, 100);
Canvas->Brush->Style = bsCross;
Canvas->Brush->Color = clGreen;
Canvas->Rectangle(240, 10, 340, 100);
Canvas->Brush->Style = bsBDiagonal;
Canvas->Brush->Color = clYellow;
Canvas->Rectangle(360, 10, 460, 100);
Canvas->Brush->Style = bsFDiagonal;
Canvas->Brush->Color = clBlack;
Canvas->Brush->Style = bsDiagCross;
Canvas->Brush->Color = clBlue;
Canvas->Rectangle(120, 140, 220, 240);
Canvas->Brush->Style = bsHorizontal;
Canvas->Brush->Color = clGreen;
Canvas->Rectangle(240, 140, 340, 240);
Canvas->Brush->Style = bsVertical;
Canvas->Brush->Color = clRed;
Canvas->Rectangle(360, 140, 460, 240);
2.1 Latihan
Buatlah Aplikasi membentuk objek dengan bidang geomerti dan
atributnya.
3.1 Pendahuluan
Koordinat dapat diartinya sebagai tata keseimbangan yang membantu
kita di dalam menentukan suatu kondisi dengan nilai dan batas dalam konteks
geometri. Pada koordinat kartesius arah vertikal digunakan sebagai sumbu y,
dengan y positif ke atas dan arah ke bawah sebagai y negatif, arah mendatar
digunakan sebagai sumbu x dan x positif ke arah kanan dan x negatif ke arah
kiri. Tetapi layar monitor menggunakan orientasi berbeda. Monitor
mengunakan arah ke bawah sebagai sumbu y positif, disamping itu monitor
juga tidak mengenal nilai negatif.
Pada komputer grafik, ada 3 macam sistem koordinat yang harus kita
perhatikan, yaitu
1. Koordinat Nyata
2. Koordinat Sistem
3. Koordinat Tampilan atau Layar
y
y
x
z
x
Titik pertemuan antara kedua sumbu, titik asal, umumnya diberi label
0. Setiap sumbu juga mempunyai besaran panjang unit, dan setiap panjang
tersebut diberi tanda dan ini membentuk semacam grid. Untuk
mendeskripsikan suatu titik tertentu dalam sistem koordinat dua dimensi, nilai
(0,0)
Y
Gambar 3.3 Sistem Koordinat Layar
Contoh :
Untuk layar dengan ukuran 400 x 640, maka
Max_x_screen = 400 dan
Max_y_screen = 640
1. Terdapat segitiga dengan sistem koordinat titik A(-10,-10), B(80,-
10), C(35, 70), konversikan ke koordinat layar
A B
Solusi
Scr_x = x + midx, dimana midx = max_x_screen/2
Scr_y = midy - y, dimana midy = max_y_screen/2
Sehingga
midx = 400/2 = 200; midy = 640/2 = 320
A’x = x + midx = -10 + 200 = 190
A’y = midy –y = 320 –(-10) = 330
B’x = x + midx = 80 + 200 = 280
B’y = midy –y = 320 –(-10) = 330
C’x = x + midx = 35 + 200 = 235
C’y = midy –y = 320 –(70) = 250
Hasil : A’(190, 330) B’(280,330) C’(235, 250)
(0,0)
midy
Bila tidak
Step=dy
BAB 5.TRANSFORMASI 2D
5.1 Transformasi
Gambar dan grafik dapat dibuat berdasarkan prosedur dan atribut
output primitif. Dalam aplikasi grafik diperlukan perubahan bentuk, ukuran dan
posisi suatu gambar yang disebut dengan manipulasi. Perubahan gambar
dengan mengubah koordinat dan ukuran suatu objek disebut transformasi
geometri. Kata transformasi berarti berubah bentuk. Transformasi diperlukan
untuk
mengubah (transform) posisi suatu objek dari suatu tempat asal ke
posisi elemen grafik.
Memindahkan suatu objek dari suatu tempat ke tempat lain
C’
C
ty tx A’ B’
A B
P2(x, y+ty)
P(x,y) P1(x+tx, y)
P3(x+(-tx),y)
P4(x, y-ty)
Contoh translasi
Untuk menggambarkan translasi suatu objek yang berupa segitiga dengan
sistem koordinat A(10, 10), B(30, 10) dan C(10, 30) dengan translasi
vektor (10, 20), pertama-tama dihitung hasil translasi satu demi satu.
Penyelesaian
Latihan :
1. Coba Gambarkan proses tranlasi tersebut
2. Geser objek ABC ke kanan 30 pixel
3. Geser objek ABC ke bawah 10 pixel
4. Terdapat segiempat ABCD dengan koodinat sebagai berikut
A(40, 100), B(70, 100), C(70, 70), D(40, 70)
a. Translasikan objek ABCD dengan translasi vektor (15, 30)
b. Geserlah objek ABCD ke kiri 40 pixel
c. Gambarkan Objek ABCD dan kedua proses transalasi A dan B
Contoh skala
Penyelesaian :
Sx=2, Sy=0,5
Xa’=xa*Sx=10*2=20 ya’=ya*Sy=20*0,5=10
Xb’=xb*Sx=50*2=100 yb’=yb*Sy=20*0,5=10
Xc’ =xc*Sx=10*2=20 yc’=yc*Sy=100*0,5=50
Sehingga A’(20,10),B’(100,10),C’(20,50)
Gambar
100
90
80
70 asal
60
50
40
30 hasil
20
10
10 20 30 40 50 60 70 80 90 100 110
Persamaan
X’=x*cos θ -y*sin θ
Y’=x*sin θ + y*cos θ
Contoh
Segitiga ABC diatas diputar 90o,hitung koordinat hasil dan gambarkan!
Segitiga A(10,20),B(50,20),dan C (10,100)
Penyelesaian
θ=90o
maka,
xa’=xa*cos 90-ya*sin 90=10*0-20*1=-20
ya’=xa*sin 90+ya*cos 90=10*1+20*0=10
xb’=xb*cos 90-yb*sin 90=50*0-20*1=-20
yb’=xb*sin 90+yb*cos 90=50*1+20*0=50
xc ’=xc *cos 90-yc*sin 90=10*0-100*1=-100
-100 -90 -80 -70 -60 -50 -40 -30 -20 -10 0 10 20 30 40 50
Latihan
1. Terdapat segiempat A(10,10),B(100,10),C(100,100),dan D(10,100)
diperbesar 2x hitung dan gambar hasil!
2. terdapat garis A(0,0) dan B(100,100) diputar –90o.hitung dan gambar
hasil !
#include <vcl.h>
#pragma hdrstop
#include "UtranSkal.h"
//---------------------------------------------------------------------------
#pragma package(smart_init)
#pragma resource "*.dfm"
TForm1 *Form1;
//---------------------------------------------------------------------------
__fastcall TForm1::TForm1(TComponent* Owner)
: TForm(Owner)
{
}
//---------------------------------------------------------------------------
}
//---------------------------------------------------------------------------
}
//---------------------------------------------------------------------------
1 0 tx
T (t x , t y ) = 0 1 t y
0 0 1
sx 0 0
0
Matriks Skala S ( s x , s y ) = 0 xy
0 0 1
Matriks refleksi terhadap sumbu x,Refx, dan matriks refleksi terhadap sumbu
y, Refy, adalah :
1 0 0 − 1 0 0
Re f x = 0 − 1 0 Re f y = 0 0 0
0 0 1 0 0 1
Dan, matriks shear terhadap sumbu y dengan faktor shy, shy(s) adalah :
1 s 0
Shx = 0 1 0
0 0 1
Karena suatu transformasi komposit pada sutu titik itu dapat dipandang
sebagai sejumlah transformasi dasar yang terjadi pada titik tersebut. Maka
matriks dari dari transformasi komposit adalah hasil perkalian dari matriks-
matriks transformasi dasar yang bersangkutan.
M komposit = M n ...M 2 M 1
1 0 x r cos α − sin α 0 1 0 − x r
= 0 1 y r sin ε cos α 0 0 1 − y r
0 0 1 0 0 1 0 0 1
1 3 x
Jawab :
A = (1,1), B = (3,1), C = (3,2), D=(1,2)
Karena objek pada titik pusat (3,2) maka sebelum dilakukan pemutaran, objek
harus ditranslasikan sebesar (-3,-2) sehingga titik pusat (3,2) berimpit dengan
titik pusat (0,0), setelah itu objek diputar sebesar 60o dan kemudian hasil
pemutaran ditranslasikan sebesar(3,2)
1. Translasi sebesar (-3,-2)
A = (1-3,1-2) = (-2, -1)
B = (3-3, 1-2) = (0, -1)
C = (3-3, 2-2) = (0, 0)
Hasil akhir dari operasi tersebut dapat dilihat pada gambar dibawah
y
D C
2 C”
1 A B B”
D”
1 A” 3 x
B. Cara 2
1. Rotasi/Skala, Misal : A’
2. Hitung dx dan dy , dx = Xt-XA’
dy = Yt-YA’
3. Translasi ke dx, dy
1 3 x
Jawab
Aplikasi
Kode program
Jam.h
//---------------------------------------------------------------------------
#ifndef jam1H
Jam.cpp
//---------------------------------------------------------------------
------
#include <vcl.h>
#include <math.h>
#pragma hdrstop
#include "jam1.h"
//---------------------------------------------------------------------
------
#pragma package(smart_init)
#pragma resource "*.dfm"
TForm1 *Form1;
//---------------------------------------------------------------------
------
__fastcall TForm1::TForm1(TComponent* Owner)
: TForm(Owner)
{
}
//---------------------------------------------------------------------
------
void __fastcall TForm1::PaintBox1Paint(TObject *Sender)
PaintBox1->Canvas->MoveTo(200,0);
PaintBox1->Canvas->Pen->Width = 3;
PaintBox1->Canvas->LineTo(200,25);
PaintBox1->Canvas->MoveTo(200,400);
PaintBox1->Canvas->LineTo(200,375);
PaintBox1->Canvas->MoveTo(0,200);
PaintBox1->Canvas->LineTo(25,200);
PaintBox1->Canvas->MoveTo(400,200);
PaintBox1->Canvas->LineTo(375,200);
PaintBox1->Canvas->MoveTo(200,200);
PaintBox1->Canvas->LineTo(200,70);
PaintBox1->Canvas->Brush->Color = RGB (100, 190, 10);
PaintBox1->Canvas->Ellipse(196,196,204,204);
x1=200; y1=200; x2=200; y2=70;
x=200; y =70;
sudut = 0;
}
//---------------------------------------------------------------------
------
void __fastcall TForm1::Timer2Timer(TObject *Sender)
{
PaintBox1->Canvas->Pen->Width = 4;
PaintBox1->Canvas->Pen->Color = RGB (100, 90, 110);
PaintBox1->Canvas->MoveTo(x1,y1);
PaintBox1->Canvas->LineTo(x2,y2);
PaintBox1->Canvas->Brush->Color = RGB (100, 190, 10);
PaintBox1->Canvas->Ellipse(196,196,204,204);
sudut=-25;
xs1=x1 *cos(sudut)-y1*sin(sudut);
ys1=x1 *sin(sudut)+y1*cos(sudut);
xs2=x2 *cos(sudut)-y2*sin(sudut);
ys2=x2 *sin(sudut)+y2*cos(sudut);
dx = x1-xs1;
dy = y1-ys1;
x1= xs1 + dx;
y1= ys1 + dy;
x2 =xs2 + dx;
y2 = ys2 + dy;
PaintBox1->Canvas->Pen->Width = 3;
PaintBox1->Canvas->Pen->Color = RGB (0, 0,0);
PaintBox1->Canvas->MoveTo(x1,y1);
PaintBox1->Canvas->LineTo(x2,y2);
PaintBox1->Canvas->Brush->Color = RGB (100, 190, 10);
PaintBox1->Canvas->Ellipse(196,196,204,204);
}
Hasil
Animasi atau gambar bergerak, merupakan salah satu bagian dari grafika
komputer. Animasi dapat digunakan untuk menarik perhatian pemakai komputer
pada bagian tertentu di layar, menvisualisasi cara kerja suatu alat bantu atau
mekanisme tertentu, menampilkan keluaran program dengan gambar-gambar yang
menarik dibanding hanya sederet angka, serta tak ketinggalan pula untuk program-
program permainan.
Teknik Animasi
1. inbetweening
Teknik animasi inbetweening merupakan teknik yang mudah untuk dipelajari.
Ide dasar dari teknik ini adalah dengan menentukan posisi awal dan posisi
akhir dari objek, dan kemudian menghitung posisi objek yang baru,
menghapus pada posisi semula dan menggambar objek pada posisi yang
baru, sampai objek berada pada posisi akhir yang dituju.
Contoh
Hiu
Rancangan
#include "shark.h"
//---------------------------------------------------------------------------
#pragma package(smart_init)
#pragma resource "*.dfm"
TForm1 *Form1;
//---------------------------------------------------------------------------
__fastcall TForm1::TForm1(TComponent* Owner)
: TForm(Owner)
{
}
//---------------------------------------------------------------------------
xg1=95; yg1=220;
xg2=95; yg2=200;
PaintBox1->Canvas->MoveTo(70,250);
PaintBox1->Canvas->Brush->Color=RGB(220,129, 178);
kapal[0] = Point(70,250);
kapal[1] = Point(120,250);
kapal[2] = Point(140,220);
kapal[3] = Point(50,220);
PaintBox1->Canvas->Polygon((TPoint*)kapal,3);
PaintBox1->Canvas->MoveTo(95,220);
PaintBox1->Canvas->LineTo(95,200);
xl1=95;yl1=200;
xl2=140; yl2=200;
xl3=95; yl3=100;
layar[0] = Point(xl1,yl1);
layar[1] = Point(xl2,yl2);
layar[2] = Point(xl3,yl3);
PaintBox1->Canvas->Polygon((TPoint*)layar,2);
PaintBox1->Canvas->MoveTo(617,200);
PaintBox1->Canvas->Brush->Color=RGB(172,146, 25);
POINT titik[5];
titik[0] = Point(617,200);
titik[1] = Point(250,250);
titik[2] = Point(500,275);
titik[3] = Point(617,300);
titik[4] = Point(617,200);
PaintBox1->Canvas->Polygon((TPoint*)titik,4);
PaintBox1->Canvas->Pen->Color=RGB(126,39, 22);
PaintBox1->Canvas->Pen->Width=5;
PaintBox1->Canvas->MoveTo(540,260);
PaintBox1->Canvas->LineTo(520,150);
PaintBox1->Canvas->Pen->Color=RGB(22,126, 88);
PaintBox1->Canvas->LineTo(560,150);
PaintBox1->Canvas->MoveTo(520,150);
PaintBox1->Canvas->Pen->Width=1;
}
//---------------------------------------------------------------------------
PaintBox1->Canvas->MoveTo(70,250);
PaintBox1->Canvas->Brush->Color=RGB(172,243, 246);
POINT kapal[4];
kapal[0] = Point(xk1,yk1);
kapal[1] = Point(xk2,yk2);
kapal[2] = Point(xk3,yk3);
kapal[3] = Point(xk4,yk4);
PaintBox1->Canvas->Polygon((TPoint*)kapal,3);
PaintBox1->Canvas->MoveTo(xg1,yg1);
PaintBox1->Canvas->LineTo(xg2,yg2);
layar[0] = Point(xl1,yl1);
layar[1] = Point(xl2,yl2);
layar[2] = Point(xl3,yl3);
PaintBox1->Canvas->Polygon((TPoint*)layar,2);
xk1=xk1+2; yk1=250;
xk2=xk2+2; yk2=250;
xk3=xk3+2; yk3=220;
xk4=xk4+2; yk4=220;
xg1=xg1+2; yg1=220;
xg2=xg2+2; yg2=200;
xl1=xl1+2;yl1=200;
xl2=xl2+2; yl2=200;
xl3=xl3+2; yl3=100;
PaintBox1->Canvas->Brush->Color=RGB(220,129, 178);
PaintBox1->Canvas->Pen->Color=RGB(0,0, 0);
PaintBox1->Canvas->MoveTo(xk1,yk1);
PaintBox1->Canvas->Brush->Color=RGB(220,129, 178);
kapal[0] = Point(xk1,yk1);
kapal[1] = Point(xk2,yk2);
kapal[2] = Point(xk3,yk3);
kapal[3] = Point(xk4,yk4);
PaintBox1->Canvas->Polygon((TPoint*)kapal,3);
PaintBox1->Canvas->MoveTo(xg1,yg1);
PaintBox1->Canvas->Pen->Width = 2;
PaintBox1->Canvas->Pen->Color=RGB(0,0, 0);
PaintBox1->Canvas->MoveTo(0,250);
PaintBox1->Canvas->LineTo(250,250);
}
//---------------------------------------------------------------------
------
8.1 Pendahuluan
Salah satu bentuk perkembangan terakhir penerapan komputer dalam
bidang grafika adalah pada aplikasi simulasi obyek tiga dimensi atau lebih
dikenal dengan sebutan kenyataan semu (virtual reality-VR). Aplikasi ini
dijumpai pada berbagai bidang dari yang sifatnya hiburan, rancang-bangun,
sampai pada simulasi untuk keperluan riset ilmiah.
Untuk mendukung adanya VR selain diperlukan suatu metode untuk
memvisualisasikan obyek 3 dimensi pada layar 2 dimensi juga didukung
perangkat keras berupa monitor yang langsung dipakai seperti memakai
kacamata dan sensor-sensor yang dipakai oleh pemakai.
Pada implementasi yang lebih sederhana dapat digunakan komputer yang
dipakai sehari-hari dengan layar monitor sebagai media penampil dan
berbagai alat input yang umum dipakai misalnya keyboard, mouse, joystick,
dan lain sebagainya.
Untuk menampilkan efek 3 dimensi pada layar 2 dimensi dengan
animasinya dapat digunakan metode analogi kamera sintetis. Dengan
metode ini suatu obyek nyata dapat dipandang dari kamera dari berbagai
jarak dan sudut pandang. Dengan mengubah jarak, sudut, dan arah
pandang akan didapatkan efek gambar dan animasi 3 dimensi di layar
kamera dari suatu obyek.
Pada implementasinya, agar didapatkan kinerja yang optimum, setiap
bagian dari obyek dibagi menjadi poligon-poligon, sehingga titik-titik yang
diproses merupakan titik acuannya saja dan setiap titik dibentuk poligon dan
diberi warna dengan kecerahan sesuai dengan posisi terhadap sumber
cahaya sintetis. Dengan demikian kualitas gambar semakin baik bila
kerapatan poligon persatuan luas semamin tinggi dengan konsekwensi beban
memori menjadi lebih tinggi dan kecepatan proses rendah, sehingga animasi
lebih kasar.
Visualisasi obyek 3 dimensi dengan komputer ini memungkinkan suatu
obyek 3 dimensi dapat dimanipulasi dan hasilnya dapat langsung terlihat
secara visual. Selain itu suatu obyek juga dapat dilihat dari berbagai jarak
a. Proyeksi paralel
b. Proyeksi perspektif
y
y y
z
z
x
z x x
x
a. Gambar kotak 3 dimensi b. Proyeksi pada bidang xy
Terdapat dua cara yang identik untuk memandang suatu obyek dari
berbagai sisi yakni bidang pandang (view plane) pada posisi tetap, obyek
diputar atau bidang pandang berputar sedangkan obyek tetap.
v yy
VUP-arah atas
Jarak pandang
VPN
u
•
N x
bidang pandang
z
Titik acuanpandang
(VRP)
yw
yw
V U N V U N
xw
xw
zw zw
V
V U
U
xw xw
N N
zw zw
yw
U xw
zw
zx
Suatu obyek nyata dapat terlihat oleh mata bila obyek tersebut
terkena oleh cahaya dan memantulkan kembali cahaya tersebut ke mata
pengamat. Pada kenyataannya warna yang terlihat pada masing-masing
bagian obyek tersebut oleh mata pengamat tidaklah sama walaupun obyek
atau benda tersebut di cat dengan warna yang sama. Bagian yang
permukaannya tegak lurus dengan cahaya akan memiliki warna yang lebih
terang dibanding bagian lainnya.
I = Is kd cos θ
Cosinus pada sudut θ dapat di wakili dengan dot product dari satuan
vektor n dan i, sehingga persamaan diatas menjadi
I = Is kd (n.i)
I = Ia + ∑ Ij kd cos θ = Ia + ∑ Ij kd (ij.n)
i
n
θ i
Suatu bidang yang akan ditinjau intensitasnya dapat diwakili oleh tiga titik
pokok misalnya titik A, B, dan C, maka vektor normalnya berupakan cross
product adalah vektor AB dan AC sehingga
Setiap titik pada suatu bidang poligon dapat dihitung nilai rata-rata n
sehingga
dengan koordinat black(0,0,0), white( 1,1,1), red( 0,0,1), green( 1,0,0), yellow(
1,0,1), magenta( 0,1,1), cyan(1,1,0), dan blue(0,1,0).
Berdasarkan model diatas maka suatu warna arsiran akan semakin terang
dengan menambah unsur putih pada setiap warna yang diproses, begitu juga
sebaliknya.
Deskripsi obyek y
tiga dimensi awal
Pemodelan
x
koordinat
z
Pemodelan v
transformasi
Koordinat dunia
nz
Transformasi ke v
bidang pandang
u
Koordinat pandang
n
Operasi pemotongan,
hapus bag. tersembunyi,
diarrsir
Normalisasi koordinat v
proyeksi
u
Proyeksi perspektif dan
n
Tranformasi ke koordinat
Koordinat layar
Ψ sumber cahaya
Warna
Vektor tegak lurus X1,y1,z1 X2,y2,z2
bidang poligon
X4,y4,z4
X3,y3,z3
poligon
Gambar 8. Pembagian poligon dan parameternya
Sturtur data:
Baris Program : 2-12
Struct {
Int x; koordinat x
Int y; kooridnat y
Int z; kooridnat z
}s[20]; titik pokok/sudut ke
s[2].x=250;s[2].y=0;s[2].z=250;
s[3].x=250;s[3].y=250;s[3].z=250;
s[4].x=0;s[4].y=250;s[4].z=250;
s[5].x=0;s[5].y=0;s[5].z=0;
s[6].x=250;s[6].y=0;s[6].z=0;
s[7].x=250;s[7].y=250;s[7].z=0;
s[8].x=0;s[8].y=150;s[8].z=0;
7
8
4
3
5 6 x
1 2
Posisi fokus ini dpaat diatur dengan menggunakan tombol atau alat
input lain
float T[4][4]=
{
{1,0,0,0},
{0,1,0,0},
{0,0,1,0},
{-(kx-vrp_x),-(ky-vrp_y),-(kz-vrp_z),1}
};
// putar sehiongga vektor n sesuai sumbu z
float v1=sqrt(dyn*dyn+dzn*dzn);
// rotasi sumbu x
float Rx[4][4]=
float Ry[4][4]=
{
{v1,0,-dxn,0},
{0,1,0,0},
{dxn,0,v1,0},
{0,0,0,1}
};
// mengalikan matriks Rx * Ry
xup_vp=dxup*Rxy[0][0]+dyup*Rxy[1][0]+dzup*Rxy[2][0];
yup_vp=dxup*Rxy[0][1]+dyup*Rxy[1][1]+dzup*Rxy[2][1];
rup=sqrt(xup_vp*xup_vp+yup_vp*yup_vp);
float Rz[4][4]=
{
{yup_vp/rup,xup_vp/rup,0,0},
{-xup_vp/rup,yup_vp/rup,0,0},
{0,0,1,0},
{0,0,0,1}
};
//transfoemasi perpeksif
for (int i=1;i<=8;i++)
{
for (int k=0;k<=3;k++)
vpn_pers[i][k]=vpn_k[i][0] * perspek[0][k] + vpn_k[i][1] * perspek[1][k] +
vpn_k[i][2]
*perspek[2][k]+ vpn_k[i][3] * perspek[3][k];
}
int tengah=PaintBox1->ClientWidth/2;
// trabsformasi ke koordinat layar
for (int i=1;i<=max_titik;i++)
{
vpn_pers[i][0]=vpn_pers[i][0]+tengah;
vpn_pers[i][1]=batasbawah-vpn_pers[i][1]-50;
}
//poligon 2 belakang
POINT t2[4]; //deklarasi variabel
//poligon 3 bawah
POINT t3[4]; //deklarasi variabel
t3[0]=Point(vpn_pers[1][0],vpn_pers[1][1]);
t3[1]=Point(vpn_pers[2][0],vpn_pers[2][1]);
t3[2]=Point(vpn_pers[6][0],vpn_pers[6][1]);
t3[3]=Point(vpn_pers[5][0],vpn_pers[5][1]);
t3[4]=Point(vpn_pers[1][0],vpn_pers[1][1]);
PaintBox1->Canvas->Polyline((TPoint*)t3,4);
//poligon 4 atas
POINT t4[4]; //deklarasi variabel
t4[0]=Point(vpn_pers[4][0],vpn_pers[4][1]);
t4[1]=Point(vpn_pers[3][0],vpn_pers[3][1]);
t4[2]=Point(vpn_pers[7][0],vpn_pers[7][1]);
t4[3]=Point(vpn_pers[8][0],vpn_pers[8][1]);
t4[4]=Point(vpn_pers[4][0],vpn_pers[4][1]);
PaintBox1->Canvas->Polyline((TPoint*)t4,4);
//poligon 5 kanan
POINT t5[4]; //deklarasi variabel
t5[0]=Point(vpn_pers[2][0],vpn_pers[2][1]);
t5[1]=Point(vpn_pers[6][0],vpn_pers[6][1]);
t5[2]=Point(vpn_pers[7][0],vpn_pers[7][1]);
t5[3]=Point(vpn_pers[3][0],vpn_pers[3][1]);
t5[4]=Point(vpn_pers[2][0],vpn_pers[2][1]);
PaintBox1->Canvas->Polyline((TPoint*)t5,4);
//poligon 6 kiri
POINT t6[4]; //deklarasi variabel
t6[0]=Point(vpn_pers[1][0],vpn_pers[1][1]);
t6[1]=Point(vpn_pers[5][0],vpn_pers[5][1]);
t6[2]=Point(vpn_pers[8][0],vpn_pers[8][1]);
t6[3]=Point(vpn_pers[4][0],vpn_pers[4][1]);
t6[4]=Point(vpn_pers[1][0],vpn_pers[1][1]);
PaintBox1->Canvas->Polyline((TPoint*)t6,4);\
//---------------------------------------------------------------------------
#ifndef rangkaH
};
//---------------------------------------------------------------------extern
PACKAGE TForm1 *Form1;
//---------------------------------------------------------------------#endif
//--------------------------------------------------------------
-------------
#include <vcl.h>
#include <math.h>
#pragma hdrstop
#include "rangka.h"
//-------------------------------------------------------------
#pragma package(smart_init)
#pragma resource "*.dfm"
TForm1 *Form1;
//--------------------------------------------------------------
__fastcall TForm1::TForm1(TComponent* Owner)
Algoritma dan kode yang sudah dibahas pada bab-bab terdahulu masih
bersifat dasar, yakni obyek masih statis dalam arti sudut, jarak pandang dan
fokus pandang masih berupa konstanta. Dengan sedikit modifikasi maka
1. Sudut dan jarak pandang dapat diubah misal dikendalikan dengan tombol
dengan mengatur nilai koordinat posisi kamera kx,ky, dan kz.
2. Titik fokus kamera dapat diubah untuk menentukan bagian obyek yang
dapat dilihat dengan mengatur vrp_x,vrp_y, dan vrp_z.
1
1
4
Paint Box
BitBtn1->Click:
kamera_y=kamera_y+20;
gambar(kamera_x,kamera_y);
BitBtn2->Click:
BitBtn3>Click:
kamera_y=kamera_y-20.0;
gambar(kamera_x,kamera_y);
BitBtn4->Click:
kamera_x=kamera_x+20;
gambar(kamera_x,kamera_y);
catatan :
Angka 20 pada counter menunjukkan posisi penggeseran setiap
tombol diklik yang dapat diatur sesuai kebutuhan. Bila
diinginkan pengeseran terasa halus/tahapan pelan maka nilai
diperkecil dan sebaliknya
s[3].x=300;s[3].y=200;s[3].z=400;
s[4].x=0;s[4].y=200;s[4].z=400;
s[5].x=0;s[5].y=0;s[5].z=0;
s[6].x=300;s[6].y=0;s[6].z=0;
s[7].x=300;s[7].y=200;s[7].z=0;
s[8].x=0;s[8].y=200;s[8].z=0;
//posisi awal kamera
kamera_x=50.0;
kamera_y=50.0;
/*
8-----------7
! !
4-----------3 !
4. Buatlah fungsi Gambar() pada editor, dan pindahkan kode yang ada
pada PaintBox1 ->Paint ke fungsi gambar() seperti dibawah ini
//------------------posisi kamera
float kx=kamx;
float ky=kamy;
float kz=800;
//----------------------------------
float d=sqrt(kx*kx+ky*ky+kz*kz);
float dxn=kx/d;
float dyn=ky/d;
………………..
…………………….. sesuai program sebelumnya
……………….
t6[2]=Point(vpn_pers[8][0],vpn_pers[8][1]);
t6[3]=Point(vpn_pers[4][0],vpn_pers[4][1]);
t6[4]=Point(vpn_pers[1][0],vpn_pers[1][1]);
PaintBox1->Canvas->Polyline((TPoint*)t6,4);
}
clRed : merah
2. dengan RGB
RGB merupakan warna yang dihasilkan kombinasi dari Red[R]-
Green[G]-Blue[B], dengan nilai R:0-255 G:0-255 B:0-255, nilai 0
pada masing2 warna adalah hitam , dan 255 adalah warna maksimal
Canvas->Brush->Style=arsiran
Brush->Color:clBlack
16.7 Mode Pen Brush->Style:csDiagonal
Garis yang membetuk suatu obyek juga dapat dibentuk
Canvas->Pen->Style=bentuk
Bentuk:
psSolid :garis homogen
psDot:garis berbentuk titik-titik
psDash: garis berbentuk garis kecil2
psDashDot: garis berbentuk kombinasi dash dan dot
Maka agar pada grafis 3D poligon yang jauh akan tertutup oleh poligon yang
dekat dengan pengamat, maka setiap poligon harus diurutkan proses
pembuatannya dimulai dari yang terjauh dari pengamat/user (nilai koordinat z
paling kecil)
Untuk mengurutkan poligon , maka nilai koordinat z dari setiap poligon harus
dihitung rata-rata dari ke empat titik yg membetuk poligon.
Sampai langkah ini realitas obyek sudah mulai nampak , yakni bagian
yang berada di belakang tidak nampak lagi, akan tetapi realitas ini masih
dapat ditingkatkan yakni dengan efek rendering , yaitu perubahan warna
akibat pencahayaan dari posisi tertentu (tidak di bahas disini, ada di buku-
buku referensi grafika komputer), shadowing, yaitu efek bayangan.
16.11Implementasi Program
Untuk menerapkan visual realism dasar dilakukan tahapan sbb
1. Bari aplikasi sebelumnya ubahlah semua kode
……Polyline…. menjadi …Polygon ………
misal :
PaintBox1->Canvas->Polyline((TPoint*)t6,4);
Diganti menjadi
PaintBox1->Canvas->Polygon((TPoint*)t6,4);
2. Tambahkan perintah untuk mengarsir poligon sebelum/diatas perintah
poligon dengan
……… Canvas->Brush->Color=warna..
warna, warna arsiran dapat diatur dengan
(i) konstanta, misal biru -> clBlue
merah -> clRed
kuning->clYellow
misal :
……… Canvas->Brush->Color=clBlue; arsir
biru
16.12Pengurutan Poligon
Agar bentuk 3d rterlihat riil maka sesuai dengan algoritma pelukis, maka
poligon yang lebih jauh diteampilkan lebih dulu. Didalam pemrograman untuk
menrpakna tersebut dilakukan langkah sbb
1. Buat nilai rata-rata setiap poligon dan tampung dlaam variabel dengan
index tersendiri
2. dengan algoritma untuk sorting (misal: bubble sort) , Urutkan setiap
nilai sesuai dengan nilai z-nya.
3. tampilkan poligon tersebut.
Grafis 3D yang telah dibuat sebelumnya masih bersifat statis, artinya grafis
belum dapat dikendalikan/dimanipulasi. Agar grafis dapat dikendalikan maka
sekurang-kurangnya parameter untuk posisi kamera dapat diatur, misalnya
menggunakan tombol untuk menggerakkan ke:kiri,kanan,atas,bawah,
sehingga program yang ada di modifikasi menjadi sbb.
Name:
Name:Kanan
Kanan
Name: Atas
Name: Bawah
Auto
Name:Auto
s[1].x=0;s[1].y=0;s[1].z=200;
s[2].x=300;s[2].y=0;s[2].z=200;
s[3].x=300;s[3].y=100;s[3].z=200;
s[4].x=0;s[4].y=100;s[4].z=200;
s[5].x=0;s[5].y=0;s[5].z=100;
s[6].x=300;s[6].y=0;s[6].z=100;
s[7].x=300;s[7].y=100;s[7].z=100;
s[8].x=0;s[8].y=100;s[8].z=100;
s[9].x=0;s[9].y=0;s[9].z=0;
s[10].x=300;s[10].y=0;s[10].z=0;
s[11].x=300;s[11].y=200;s[11].z=0;
s[12].x=0;s[12].y=200;s[12].z=0;
//posisi awal kamera
kamera_x=100.0;kamera_y=100;
/*
8-----------7
! !
4-----------3 !
! 5--!-------6
1---------- 2
*/
}
//------------------posisi kamera
float kx=kamx;
float ky=kamy;
float kz=500;
//----------------------------------
float d=sqrt(kx*kx+ky*ky+kz*kz);
float dxn=kx/d;
float dyn=ky/d;
float dzn=kz/d;
float Ry[4][4]=
{
{v1,0,-dxn,0},
{0,1,0,0},
{dxn,0,v1,0},
{0,0,0,1}
};
// mengalikan matriks Rx * Ry
float Rz[4][4]=
{
{yup_vp/rup,xup_vp/rup,0,0},
{-xup_vp/rup,yup_vp/rup,0,0},
{0,0,1,0},
{0,0,0,1}
};
//transfoemasi perpeksif
for (int i=1;i<=max_titik;i++)
{
for (int k=0;k<=3;k++)
vpn_k[i][k]=vpn_k[i][0]* perspek[0][k]
+vpn_k[i][1]* perspek[1][k]
+ vpn_k[i][2]*perspek[2][k]
+vpn_k[i][3] * perspek[3][k];
int tengah_x=PaintBox2->ClientWidth/2;
// trabsformhasi ke koordinat layar
float tk_x=(vpn_k[1][0]+vpn_k[2][0])/2;
int geser_x=tengah_x-tk_x;
int tengah_y=PaintBox2->ClientHeight/2;
// trabsformhasi ke koordinat layar
for(int i=1;i<=max_titik;i++)
{
vpn_k[i][0]=vpn_k[i][0]+geser_x;
vpn_k[i][1]=vpn_k[i][1]+geser_y;
}
p[1].x[2]=vpn_k[2][0];
p[1].y[2]=vpn_k[2][1];
p[1].z[2]=vpn_k[2][4];
p[1].x[3]=vpn_k[3][0];
p[1].y[3]=vpn_k[3][1];
p[1].z[3]=vpn_k[3][4];
p[1].x[4]=vpn_k[4][0];
p[1].y[4]=vpn_k[4][1];
p[1].z[4]=vpn_k[4][4];
//poli 2:belakang
p[2].x[1]=vpn_k[5][0];
p[2].y[1]=vpn_k[5][1];
p[2].z[1]=vpn_k[5][4];
p[2].x[2]=vpn_k[6][0];
p[2].y[2]=vpn_k[6][1];
p[2].z[2]=vpn_k[6][4];
p[2].x[3]=vpn_k[7][0];
p[2].y[3]=vpn_k[7][1];
p[2].z[3]=vpn_k[7][4];
p[2].x[4]=vpn_k[8][0];
p[2].y[4]=vpn_k[8][1];
p[2].z[4]=vpn_k[8][4];
//poli 3:bawah
p[3].x[1]=vpn_k[1][0];
p[3].y[1]=vpn_k[1][1];
p[3].z[1]=vpn_k[1][4];
p[3].x[3]=vpn_k[6][0];
p[3].y[3]=vpn_k[6][1];
p[3].z[3]=vpn_k[6][4];
p[3].x[4]=vpn_k[5][0];
p[3].y[4]=vpn_k[5][1];
p[3].z[4]=vpn_k[5][4];
//poli 4:atas depan
p[4].x[1]=vpn_k[4][0];
p[4].y[1]=vpn_k[4][1];
p[4].z[1]=vpn_k[4][4];
p[4].x[2]=vpn_k[3][0];
p[4].y[2]=vpn_k[3][1];
p[4].z[2]=vpn_k[3][4];
p[4].x[3]=vpn_k[7][0];
p[4].y[3]=vpn_k[7][1];
p[4].z[3]=vpn_k[7][4];
p[4].x[4]=vpn_k[8][0];
p[4].y[4]=vpn_k[8][1];
p[4].z[4]=vpn_k[8][4];
//poli 5:kanan
p[5].x[1]=vpn_k[2][0];
p[5].y[1]=vpn_k[2][1];
p[5].z[1]=vpn_k[2][4];
p[5].x[2]=vpn_k[6][0];
p[5].y[2]=vpn_k[6][1];
p[5].z[2]=vpn_k[6][4];
p[5].x[3]=vpn_k[7][0];
p[5].y[3]=vpn_k[7][1];
p[5].z[3]=vpn_k[7][4];
p[5].x[4]=vpn_k[3][0];
p[5].y[4]=vpn_k[3][1];
p[5].z[4]=vpn_k[3][4];
//poli 6:kiri
p[6].x[1]=vpn_k[1][0];
p[6].y[1]=vpn_k[1][1];
p[6].z[1]=vpn_k[1][4];
p[6].x[2]=vpn_k[5][0];
p[6].y[2]=vpn_k[5][1];
p[6].z[2]=vpn_k[5][4];
p[6].x[4]=vpn_k[4][0];
p[6].y[4]=vpn_k[4][1];
p[6].z[4]=vpn_k[4][4];
int v=p[j+1].y[k];
p[j+1].y[k]=p[j].y[k];
p[j].y[k]=v;
}
}//if
}
}
//bacground putih
PaintBox2->Canvas->Brush->Color=clWhite;
PaintBox2->Canvas->Rectangle(1,1,ClientWidth-1,ClientHeight-1);
POINT g2[4];
g2[0]=Point(p[2].x[1],p[2].y[1]);
g2[1]=Point(p[2].x[2],p[2].y[2]);
g2[2]=Point(p[2].x[3],p[2].y[3]);
g2[3]=Point(p[2].x[4],p[2].y[4]);
g2[4]=Point(p[2].x[1],p[2].y[1]);
PaintBox2->Canvas->Brush->Color=clGreen;
PaintBox2->Canvas->Polygon((TPoint*)g2,4);
POINT g3[4];
g3[0]=Point(p[3].x[1],p[3].y[1]);
g3[1]=Point(p[3].x[2],p[3].y[2]);
g3[2]=Point(p[3].x[3],p[3].y[3]);
g3[3]=Point(p[3].x[4],p[3].y[4]);
g3[4]=Point(p[3].x[1],p[3].y[1]);
PaintBox2->Canvas->Brush->Color=clGray;
PaintBox2->Canvas->Polygon((TPoint*)g3,4);
POINT g4[4];
g4[0]=Point(p[4].x[1],p[4].y[1]);
g4[1]=Point(p[4].x[2],p[4].y[2]);
g4[2]=Point(p[4].x[3],p[4].y[3]);
g4[3]=Point(p[4].x[4],p[4].y[4]);
g4[4]=Point(p[4].x[1],p[4].y[1]);
//PaintBox2->Canvas->Brush->Color=clGray;
PaintBox2->Canvas->Polygon((TPoint*)g4,4);
POINT g5[4];
g5[0]=Point(p[5].x[1],p[5].y[1]);
g5[1]=Point(p[5].x[2],p[5].y[2]);
g5[2]=Point(p[5].x[3],p[5].y[3]);
g5[3]=Point(p[5].x[4],p[5].y[4]);
g5[4]=Point(p[5].x[1],p[5].y[1]);
PaintBox2->Canvas->Brush->Color=clGreen;
PaintBox2->Canvas->Polygon((TPoint*)g5,4);
POINT g6[4];
g6[0]=Point(p[6].x[1],p[6].y[1]);
g6[1]=Point(p[6].x[2],p[6].y[2]);
g6[2]=Point(p[6].x[3],p[6].y[3]);
g6[3]=Point(p[6].x[4],p[6].y[4]);
g6[4]=Point(p[6].x[1],p[6].y[1]);
PaintBox2->Canvas->Brush->Color=RGB(2,100,200);
PaintBox2->Canvas->Polygon((TPoint*)g6,4);
}
16.13.1Tombol Kanan-OnClick
16.13.2Tombol Kiri-OnClick
16.13.4Tombol Bawah-OnClick
16.13.5Tombol Auto-OnClick
struct poligon{
int x[4];
int y[4];
int z[4];
int zrata;
}p[9];
};
//---------------------------------------------------------------------
------
extern PACKAGE TForm1 *Form1;
//---------------------------------------------------------------------
------
Grafis 3D yang telah dibuat sebelumnya walaupun sudah nampak lebih riil
(setiap poligon di arsir) dan dapat di kendalikan (interaktif) tetapi bentuk
…….
//menetukan jujlkah obyek dan jumlkah titik sudut
PaintBox2->Canvas->Brush->Color=clWhite;
PaintBox2->Canvas->Rectangle(1,1,ClientWidth-1,ClientHeight-1);
int jumlah_obyek=1;
int max_titik=12;
int max_poli=9;
//------------------posisi kamera
float kx=kamx;
float ky=kamy;
float kz=500;
//----------------------------------
float d=sqrt(kx*kx+ky*ky+kz*kz);
float dxn=kx/d;
…………………..
s[3].x=300;s[3].y=100;s[3].z=200;
s[4].x=0;s[4].y=100;s[4].z=200;
s[5].x=0;s[5].y=0;s[5].z=100;
s[6].x=300;s[6].y=0;s[6].z=100;
s[7].x=300;s[7].y=100;s[7].z=100;
s[8].x=0;s[8].y=100;s[8].z=100;
s[9].x=0;s[9].y=0;s[9].z=0;
s[10].x=300;s[10].y=0;s[10].z=0;
p[5].x[2]=vpn_k[6][0];
p[5].y[2]=vpn_k[6][1];
p[5].z[2]=vpn_k[6][4];
p[5].x[3]=vpn_k[7][0];
p[5].y[3]=vpn_k[7][1];
p[5].z[3]=vpn_k[7][4];
p[5].x[4]=vpn_k[3][0];
p[5].y[4]=vpn_k[3][1];
p[5].z[4]=vpn_k[3][4];
POINT g2[4];
g2[0]=Point(p[2].x[1],p[2].y[1]);
g2[1]=Point(p[2].x[2],p[2].y[2]);
g2[2]=Point(p[2].x[3],p[2].y[3]);
g2[3]=Point(p[2].x[4],p[2].y[4]);
g2[4]=Point(p[2].x[1],p[2].y[1]);
//PaintBox2->Canvas->Brush->Color=clGreen;
PaintBox2->Canvas->Polygon((TPoint*)g2,4);
POINT g3[4];
g3[0]=Point(p[3].x[1],p[3].y[1]);
g3[1]=Point(p[3].x[2],p[3].y[2]);
g3[2]=Point(p[3].x[3],p[3].y[3]);
g3[3]=Point(p[3].x[4],p[3].y[4]);
g3[4]=Point(p[3].x[1],p[3].y[1]);
//PaintBox2->Canvas->Brush->Color=clBlue;
PaintBox2->Canvas->Polygon((TPoint*)g3,4);
POINT g4[4];
g4[0]=Point(p[4].x[1],p[4].y[1]);
g4[1]=Point(p[4].x[2],p[4].y[2]);
g4[2]=Point(p[4].x[3],p[4].y[3]);
g4[3]=Point(p[4].x[4],p[4].y[4]);
g4[4]=Point(p[4].x[1],p[4].y[1]);
//PaintBox2->Canvas->Brush->Color=clGray;
PaintBox2->Canvas->Polygon((TPoint*)g4,4);
POINT g5[4];
g5[0]=Point(p[5].x[1],p[5].y[1]);
g5[1]=Point(p[5].x[2],p[5].y[2]);
g5[2]=Point(p[5].x[3],p[5].y[3]);
g5[3]=Point(p[5].x[4],p[5].y[4]);
g5[4]=Point(p[5].x[1],p[5].y[1]);
//PaintBox2->Canvas->Brush->Color=clGreen;
PaintBox2->Canvas->Polygon((TPoint*)g5,4);
POINT g6[4];
g6[0]=Point(p[6].x[1],p[6].y[1]);
g6[1]=Point(p[6].x[2],p[6].y[2]);
g6[2]=Point(p[6].x[3],p[6].y[3]);
g6[3]=Point(p[6].x[4],p[6].y[4]);
g6[4]=Point(p[6].x[1],p[6].y[1]);
//PaintBox2->Canvas->Brush->Color=RGB(2,100,200);
PaintBox2->Canvas->Polygon((TPoint*)g6,4);
POINT g7[4];
POINT g8[4];
g8[0]=Point(p[8].x[1],p[8].y[1]);
g8[1]=Point(p[8].x[2],p[8].y[2]);
g8[2]=Point(p[8].x[3],p[8].y[3]);
g8[3]=Point(p[8].x[4],p[8].y[4]);
g8[4]=Point(p[8].x[1],p[8].y[1]);
//PaintBox2->Canvas->Brush->Color=RGB(2,100,50);
PaintBox2->Canvas->Polygon((TPoint*)g8,4);
POINT g9[4];
g9[0]=Point(p[9].x[1],p[9].y[1]);
g9[1]=Point(p[9].x[2],p[9].y[2]);
g9[2]=Point(p[9].x[3],p[9].y[3]);
g9[3]=Point(p[9].x[4],p[9].y[4]);
g9[4]=Point(p[9].x[1],p[9].y[1]);
//PaintBox2->Canvas->Brush->Color=RGB(2,100,20);
PaintBox2->Canvas->Polygon((TPoint*)g9,4);
}
5. Jalankan !
Realita visual (visual realism) akan menjadi lebih baik dengan adanya
proyeksi perspektif pada bidang uv karena obyek yang jauh akan nampak
lebih kecil. Selain itu kesan 3 dimensi akan semakin nampak dengan adanya
rendering dan bayangan (shadowing), sehingga suatu obyek walaupun
warnanya homogen tetapi akibat pengaruh pencahayaan dari suatu tempat
maka kecerahan warna berbeda pada setiap titik atau setiap poligon yang
membentuk obyek tersebut selain itu akan muncul bayangan yang akan
mempertajam efek 3 dimensi.
Semakin tinggi kerapatan poligon per satuan luas maka gambar yang
muncul akan semakin halus, dengan konsekwensi beban memori akan
semakin tinggi pula. Melalui penambahan berbagai efek yang sering terjadi
di dunia nyata, sudah dapat dihasilkan kenyataan semu yang dapat
digunakan untuk memvisualkan atau untuk simulasi dalam berbagai hal.
Insap Santoso, Ir., M.Sc. 1994. Grafika Komputer dan Antar Muka Grafis. Andi
Offset . Yogyakarta. Cetakan I.
Edhi Nugroho, 2005. Teori dan Praktek Grafika Komputer. Penerbit Graha
Ilmu. Yogyakarta