Grafcom

Home

2009-02-09T03:10:00.000-08:00

NAMA KELOMPOK 2 :

DEDI IRAWAN
KUKUH HERU Z
PURWOKO DC
HERU CAHYONO
NOVAN PUJI M
ISMAIL M
MARIANO AW
IRENK SURYA AK
DHEMI AL

ALGORITMA UNTUK PENGGAMBARAN GARIS

Penggambaran grafik garis lurus dan kurva memerlukan waktu komputasi yang tinggi, untuk mereduksi waktu komputasi yang tinggi tersebut dapat dilakukan dengan peningkatan kemampuan komputasi prosesor dan peningkatan efisiensi algoritma. Algoritma Midpoint merupakan Algoritma dengan dasar operasi bilangan integer, sehingga memerlukan waktu operasi yanglebih sedikit dibandingkan dengan algoritma yang menggunakan operasi bilangan riel.

Read More>>
************************************************************************************************************

LINGKARAN BRESENHAM

============================================
= 1. MOKHAMAD IRWAN ALIFI (076403020009)
= 2. SLAMET WAHYU UTOMO (076403020005)
= 3. IRWANTO (070403020031)
= 4. M. NURIL ANWAR (070403020013)
= 5. M. RIDHO SANTOSO (070403020020)
= 6. MIEISA PALUPI (086403020002)
= 7. DWI SUGI P. (076403020006)
= 8. ARIF ARDIASYAH (070403020016)
============================================

Algoritma lingkaran bresenham memerlukan menggambar pada octant yang pertama saja sedangkan titik-titik pada kuadran lain dapat diperoleh pada pencerminan titik-titik pada oktan pertama.
Read More >>
************************************************************************************

nama kelompok :

lidya wati
wulan hernawati
sri kurniasih
raghyl sasmitha
suharjono
gigih prananto
tri murwono
arifai

GAMBAR TRANFORMASI 2D

unit Unit1;

interface

uses
Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls, Forms,
Dialogs, StdCtrls, jpeg, ExtCtrls;

Read More >>
************************************************************************************************
Transformasi dua dimensi
Dasar Teori

Viewport
Objek yang akan digambar pada layar biasanya memiliki ukuran yang jauh lebih besar dibanding ukuran layar, sehingga perlu dilakukan pemetaan/transformasi yang memungkinkan objek tersebut bisa digambar pada layar. Meskipun demikian, objek seringkali terlalu rumit untuk ditampilkan pada layar dengan koordinat yang sangat terbatas. Sehingga biasanya kita memilih bagian tertentu dari objek untuk ditampilkan pada layar. Didalam memilih objek yang akan ditampilkan biasanya dibatasi oleh sebuah kotak yang disebut dengan jendela (window).
Dalam praktek kita bisa menggunakan seluruh atau sebagian lebar layar untuk menmpilkan objek yang berada pada sebuah jendela. Daerah layar yang dipilih untuk menampilkan objek yang dimaksud disebut viewport. Dalam keadaan normal, viewport akan meliputi seluruh layar lebar. Meskipun demikian, kita bisa memilih bagian tertentu dari layar untuk dijadikan sebuah viewport.
Read More >>
************************************************************************************

Transformasi 2D

=============================================
= 1. MOKHAMAD IRWAN ALIFI (076403020009)
= 2. SLAMET WAHYU UTOMO (076403020005)
= 3. IRWANTO (070403020031)
= 4. M. NURIL ANWAR (070403020013)
= 5. M. RIDHO SANTOSO (070403020020)
= 6. MIEISA PALUPI (086403020002)
= 7. DWI SUGI P (076403020006)
= 8. ARIF ARDIASYAH (070403020016)
=============================================

Struktur Titik dan Vektor

Struktur data dari titik 2D

typedef struct {

float x,y;

} point2D_t;

Sturktur Data dari vektor 2D

typedef struct {

float v[3];

} vector2D_t;

Perubahan Titik dan Vektor

Kelompok 3 Transformasi 3D

2009-02-09T02:05:00.000-08:00

Transformasi pada obyek tiga dimensi

( x’, y’,z’ ) = ( Tx +x, Ty +y, Tz +z)
dengan x’,y’, z’ : koordinat hasil transformasi
x,y,z : koordinat titik awal
Tx,Ty, Tz : faktor penggeseran kearah x, y, z
2. Pembesaran (scaling)
( x’,y’,z’ ) = (Sx *x, Sy *y, Sz *z)
dengan Sx,Sy, Sz : faktor pembesaran kearah x, y, z
3. Perputaran (rotation)
a) terhadap sumbu x
( x’,y’, z’ ) = (x , y *cos q +z*sinq, - y *sinq+z*consq)
b) terhadap sumbu y
( x’,y’,z’ ) = ( x *cos q +z*sinq,y , - x *sinq+z*consq)
c) terhadap sumbu z
(x’,y’, z’ ) = ( x *cos q +y*sinq, - x*sinq+y*consq , z )
dengan q : sudut putar berlawanan arah jarum jam

Teknik penampilan obyek 3 dimensi

Pada sistem dua dimensi obyek gambar dua dimensi dapat langsung di aplikasikan pada layar karena memiliki dimensi yang sama, kalaupun ada perbedaan hanya pada arah sumbunya. Koordinat Cartesian memiliki sumbu y arah ke atas, sedangkan koordinat layar sumbu y ke arah bawah. Akan tetapi dengan sedikit modifikasi atau menggunakan fungsi bahasa pemrograman tertentu misalnya Borland C++ 4.0 keatas dengan fungsi terpasang, koordinat layar dapat disesuaikan dengan kordinat kartesian dengan sumbu y ke arah atas. Pada sistem tiga dimensi setiap titik memiliki 3 koordinat yaitu koordinat x, y, dan z, sedangkan layar hanya memiliki sumbu x dan y. Oleh karena itu diperlukan transformasi dari koordinat tiga dimensi atau disebut dengan koordinat dunia menjadi koordinat dua dimensi. Beberapa metode untuk menampilkan efek tiga dimensi pada layar dua dimensi selain metode kamera sintetis yaitu proyeksi paralel, dan proyeksi perspektif.

a. Proyeksi Paralel

Proyeksi paralel merupakan teknik dasar untuk penyajian obyek tiga dimensi pada layar dua dimensi, yang bertumpu pada 3 sudut pandang. Pandangan depan, pandangan samping dan pandangan atas. Contoh proyeksi paralel seperti pada gambar 1. Untuk menggambarkan proyeksi paralel dalam tiga dimensi diperlukan beberapa sudut pandang minimal atas, samping dan depan kemudian di proyeksikan dalam koordinat tiga dimensi sehingga seperti terlihat pada gambar

Proyeksi parallel merupakan teknik yang relatif sederhana tetapi gambar yang ditampilkan masih sulit untuk dibayangkan sebagai image tiga dimensi, seperti pada gambar 1. Untuk itu dikembangkan cara lain yaitu dengan teknik proyeksi perspektif seperti pada gambar 2.

b. Proyeksi Perspektif

Proyeksi perspektif adalah bentuk gambar tiga dimensi seperti yang dilihat pada kenyataan sesungguhnya seperti yang terlihat oleh mata manusia ataupun kamera. Teknik ini lebih menggambarkan keadaan yang sesungguhnya tetapi untuk obyek dalam bentuk gambar rangka (wire frame) untuk kedalaman tertentu dapat menimbulkan dualisme gambar. Misalnya bagian yang terkesan didalam kadang-kadang juga terkesan di luar.

c. Kamera sintetis

Metode pendekatan yang telah dibahas dengan teknik proyeksi diatas masih belum mampu menghasilkan efek 3 dimensi dengan baik. Pada proyeksi paralel yang terlihat oleh pengamat hanyalah bagian depan obyek sedang bagian yang lebih jauh untuk posisi x, dan y yang sama tak terlihat. Sedangkan pada proyeksi perspektif mata harus terletak pada sumbu koordinat z, yang berarti bidang pandang harus berimpit dengan bidang koordinat, misalnya xy. Dengan ketentuan ini maka penyajian obyek tiga dimensi menjadi terbatas. Untuk mengatasi hal tersebut sebelum diproyeksikan diperlukan proses transformasi rotasi sehingga suatu obyek dapat dipandang dari berbagai posisi, atas, bawah, samping dan lain sebagainya. 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. Bila digunakan cara kedua dengan bidang pandang dianggap sebagai film dalam kamera, maka suatu obyek dapat di pandang dari berbagai sisi dengan menggerakkan dan memutar kamera. Metode ini sering disebut dengan metode kamera sitetis (synthetic camera) seperti pada gambar 3.

Contoh menggunakan Delphi 7

Screen Shoot

Script :

unit Main;

interface

uses
Windows, Messages, SysUtils, Classes, Graphics, Controls, Forms, Dialogs,
OpenGL, MyOpenGL, Mesh, StdCtrls, ExtCtrls, ComCtrls,Transf3D;

type
TForm1 = class(TForm)
Panel1: TPanel;
GroupBox1: TGroupBox;
ETRZ: TEdit;
ETRY: TEdit;
ETRX: TEdit;
Trx: TLabel;
Label1: TLabel;
Label2: TLabel;
TranslasiBtn: TButton;
GroupBox2: TGroupBox;
Label3: TLabel;
Label4: TLabel;
Label5: TLabel;
ESZ: TEdit;
ESY: TEdit;
ESX: TEdit;
SkalaBtn: TButton;
GroupBox3: TGroupBox;
Label7: TLabel;
Label8: TLabel;
Label9: TLabel;
Label10: TLabel;
ERZ: TEdit;
ERY: TEdit;
ERX: TEdit;
RotasiBtn: TButton;
ESudut: TEdit;
VertexView: TListView;
Label6: TLabel;
Memo1: TMemo;
procedure FormCreate(Sender: TObject);
procedure FormPaint(Sender: TObject);
procedure TranslasiBtnClick(Sender: TObject);
procedure SkalaBtnClick(Sender: TObject);
procedure RotasiBtnClick(Sender: TObject);
procedure FormResize(Sender: TObject);
private
{ Private declarations }
ftrx, ftry, ftrz:real;
frx, fry, frz:real;
fsx,fsy,fsz:real;
fsudut:real;
fmode_transformasi:byte;
fKubus:TKubus;
fTransf:TTransf3D;
procedure AmbilVertex;
procedure TransformVertex;
public
{ Public declarations }
end;

var
Form1: TForm1;

implementation

{$R *.DFM}

const
TRANSF_TRANSLASI = 0;
TRANSF_ROTASI = 1;
TRANSF_SKALA = 2;

procedure TForm1.TransformVertex;
var
index:integer;
vp,v:TVertex3D;
begin
for index:=0 to fKubus.VertexCount-1 do
begin
v:=fKubus.Vertex[index];
fTransf.Transform(v.vertex, vp.vertex);
fKubus.ChangeVertex(index,vp.vertex.x, vp.vertex.y, vp.vertex.z);
end;
end;

procedure TForm1.AmbilVertex;
var
index:integer;
item:TListItem;
begin
//bersihkan VertexView
VertexView.Items.Clear;
for index:=0 to fKubus.VertexCount-1 do
begin
item:=VertexView.Items.Add;
with fKubus do
begin
item.Caption:= Format('%2.2f',[Vertex[index].vertex.x]);
item.SubItems.Add(Format('%2.2f',[Vertex[index].vertex.y]));
item.SubItems.Add(Format('%2.2f',[Vertex[index].vertex.z]));
end;
end;
end;

procedure TForm1.FormCreate(Sender: TObject);
begin
fKubus:=TKUbus.Create(true,true,1.0,1.0,0.0);
fKubus.ChangeColor(KUBUS_ATAS,1.0,0.0,0.0);
fTransf:=TTransf3D.Create;

ftrx:=0; ftry:=0; ftrz:=0;
frx:=0; fry:=0; frz:=0;
fsx:=0; fsy:=0; fsz:=0;
fmode_transformasi:=9;

glDC:=GetDC(Handle);
InitOpenGL(glDC);
Axis3D:=TAxis3D.Create;
glEnable(GL_DEPTH_TEST);
// glPolygonMode(GL_FRONT_AND_BACK,GL_LINE);

glViewport(Panel1.Width,0,Width-Panel1.Width,Height-Memo1.Height);

glMatrixMode(GL_PROJECTION);
glLoadIdentity;

gluPerspective(45, (width - Panel1.Width)/height,1.0, 100.0);
gluLookAt(3.0, 2.0, 3.0,
0.0, 0.0, 0.0,
0.0, 1.0, 0.0);
glMatrixMode(GL_MODELVIEW);
glLoadIdentity;
end;

procedure TForm1.FormPaint(Sender: TObject);
var
index:integer;
v,vp:TPoint3D;
begin
glClearCOlor(0.0, 0.0, 0.0, 0.0);
glClear(GL_COLOR_BUFFER_BIT or GL_DEPTH_BUFFER_BIT);
{ glLoadIdentity;
case fmode_transformasi of
TRANSF_TRANSLASI : glTranslatef(ftrx,ftry,ftrz);
TRANSF_ROTASI : glRotatef(fsudut, frx, fry, frz);
TRANSF_SKALA : glScalef(fsx,fsy,fsz);
end;}

fKubus.Draw;
Axis3D.Draw;
glFlush;
//update daftar vertex
AmbilVertex;
end;

procedure TForm1.TranslasiBtnClick(Sender: TObject);
begin
ftrx:=StrToFloat(ETRX.Text);
ftry:=StrToFloat(ETRY.Text);
ftrz:=StrToFloat(ETRZ.Text);
fmode_transformasi:=TRANSF_TRANSLASI;
fTransf.ClearTransformation;
fTransf.Translation(ftrx,ftry,ftrz);
TransformVertex;
Repaint;
end;

procedure TForm1.SkalaBtnClick(Sender: TObject);
begin
fsx:=StrToFloat(ESX.Text);
fsy:=StrToFloat(ESY.Text);
fsz:=StrToFloat(ESZ.Text);
fmode_transformasi:=TRANSF_SKALA;
fTransf.ClearTransformation;
fTransf.Scaling(fsx,fsy,fsz,0,0,0);
TransformVertex;
Repaint;
end;

procedure TForm1.RotasiBtnClick(Sender: TObject);
begin
frx:=StrToFloat(ERX.Text);
fry:=StrToFloat(ERY.Text);
frz:=StrToFloat(ERZ.Text);
fsudut:=StrToFloat(ESudut.Text);
fmode_transformasi:=TRANSF_ROTASI;
fTransf.ClearTransformation;
fTransf.Rotation(fsudut,frx,fry,frz);
TransformVertex;
Repaint;
end;

procedure TForm1.FormResize(Sender: TObject);
begin
glViewport(Panel1.Width,0,Width-Panel1.Width,Height);

glMatrixMode(GL_PROJECTION);
glLoadIdentity;

gluPerspective(45, (width - Panel1.Width)/height,1.0, 100.0);
gluLookAt(8.0, 4.0, 9.0,
0.0, 0.0, 0.0,
0.0, 1.0, 0.0);
glMatrixMode(GL_MODELVIEW);
glLoadIdentity;
Repaint;
end;

end.

Download Sample Program

Download Program Source

Kelompok 1 Open GL

2009-02-08T21:40:00.000-08:00

OPEN GL

unit Unit1;

interface

uses
Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls, Forms,
Dialogs, ExtCtrls, ComCtrls;

type
TForm1 = class(TForm)
TrackBar1: TTrackBar;
gmb: TImage;
procedure TrackBar1Change(Sender: TObject);
procedure FormActivate(Sender: TObject);
procedure FormResize(Sender: TObject);
private
{ Private declarations }
public
{ Public declarations }
end;

var
Form1: TForm1;

implementation

{$R *.dfm}

procedure TForm1.TrackBar1Change(Sender: TObject);
var
r,y,x,x1,y1,x2,y2,x3,y3,x4,y4:integer;
xc,yc:integer;
pos1,pos2,pos3,pos4,pos5:Tpoint;
begin

with gmb.Canvas do

begin
rectangle (0,0,width,height);
end;
xc:=gmb.width div 2; yc:=gmb.Height div 2;
gmb.Canvas.MoveTo(xc,yc+50);

r:=50;

y:=round(r*sin(Trackbar1.position*pi/1...
x:=round(r*cos(Trackbar1.position*pi/1...
y1:=round(r*sin((Trackbar1.Position+72...
x1:=round(r*cos((Trackbar1.Position+72...
y2:=round(r*sin((Trackbar1.Position+14...
x2:=round(r*cos((Trackbar1.Position+14...
y3:=round(r*sin((Trackbar1.Position+21...
x3:=round(r*cos((Trackbar1.Position+21...
y4:=round(r*sin((Trackbar1.Position+28...
x4:=round(r*cos((Trackbar1.Position+28...

pos1.X:=xc+x; pos1.Y:=(yc+50)-y;
pos2.X:=xc+x1; pos2.Y:=(yc+50)-y1;
pos3.X:=xc+x2; pos3.Y:=(yc+50)-y2;
pos4.X:=xc+x3; pos4.Y:=(yc+50)-y3;
pos5.X:=xc+x4; pos5.Y:=(yc+50)-y4;

gmb.Canvas.pen.Color:=clred;
gmb.Canvas.Pen.style:=pssolid;
gmb.Canvas.polygon ([pos1,pos2,pos3,pos4,pos5,pos1]);

gmb.Canvas.Pen.color:=clred;

gmb.Canvas.MoveTo(xc,yc-50);
gmb.canvas.lineto(pos1.X,pos1.y);
gmb.Canvas.MoveTo(xc,yc-50);
gmb.canvas.lineto(pos2.X,pos2.y);
gmb.Canvas.MoveTo(xc,yc-50);
gmb.canvas.lineto(pos3.X,pos3.y);
gmb.Canvas.MoveTo(xc,yc-50);
gmb.canvas.lineto(pos4.X,pos4.y);
gmb.Canvas.MoveTo(xC,yc-50);
gmb.canvas.lineto(pos5.X,pos5.y);

gmb.Canvas.textout(pos1.X+2,pos1.Y+2,'('...
gmb.Canvas.textout(pos2.X+2,pos2.Y+2,'('...
gmb.Canvas.textout(pos3.X+2,pos3.Y+2,'('...
gmb.Canvas.textout(pos4.X+2,pos4.Y+2,'('...
gmb.Canvas.textout(pos5.X+2,pos5.Y+2,'('...

gmb.Canvas.Pen.Color:=claqua;
gmb.canvas.moveto(xc,0);gmb.Canvas.lin...
gmb.canvas.moveto(0,yc);gmb.Canvas.lin...
application.processmessages;
end;

procedure TForm1.FormActivate(Sender: TObject);
begin
gmb.Picture.Bitmap:=Tbitmap.Create;
doublebuffered:=true;
//windouwstate:=WSmaximized;

end;

procedure TForm1.FormResize(Sender: TObject);
begin
with gmb.Picture.Bitmap do
begin
width:=gmb.width;
height:=gmb.Height;

end;
end;
end.

Kelompok 1 Transformasi 3D

2009-02-08T21:25:00.000-08:00

GAMBAR TRANFORMASI 3D

unit Unit1;

interface
....
....
var
Form1: TForm1;
scr : tbitmap;
implementation
uses math,tridi;

{$R *.dfm}

procedure TForm1.FormCreate(Sender: TObject);
begin
scr:=tbitmap.create;
scr.width:=320;
scr.height:=240;
scr.PixelFormat:=pf32bit;
end;

end.

{$i getresult}
var scene:tscene;
gruplampu:tlightgroup;
lampu:array[0..10] of tbaselight;
tank:tobj3d;
procedure initgame;
begin
tank:=tobj3d.create;
loadmodel(tank,'tank1.obj',0);

textures[0]:=ttexture.createsolid($ffffff);

scene:=tscene.create(320,240);

gruplampu:=tlightgroup.create(scene,255,255,255);
lampu[0]:=tsunlight.create(gruplampu,-50,50,-200,50,0);

end;
procedure gameloop;
begin
scene.reset;
scene.addlights(gruplampu);
camx:=0;
camy:=0;
camz:=-1000;
tank.rotate(1,0,0);
tank.submit;
scene.uploadgeom(@vertexs[0],@faces[0],wnv,wnf);
scene.drawscene(true,1+2);
scene.uploadlight;
scene.modulate;
end;

// kode ditambahkan pada form create
procedure TForm1.FormCreate(Sender: TObject);
begin
scr:=tbitmap.create;
scr.width:=320;
scr.height:=240;
scr.PixelFormat:=pf32bit;
initgame;
end;

procedure TForm1.Timer1Timer(Sender: TObject);
begin
gameloop;
getresult(scr,scene);
canvas.Draw(0,0,scr);
end;

kelompok 2 Program DDA & bresenham

2009-02-08T03:26:00.000-08:00

NAMA KELOMPOK 2 :

DEDI IRAWAN
KUKUH HERU Z
PURWOKO DC
HERU CAHYONO
NOVAN PUJI M
ISMAIL M
MARIANO AW
IRENK SURYA AK
DHEMI AL

ALGORITMA UNTUK PENGGAMBARAN GARIS
Penggambaran grafik garis lurus dan kurva memerlukan waktu komputasi yang tinggi, untuk mereduksi waktu komputasi yang tinggi tersebut dapat dilakukan dengan peningkatan kemampuan komputasi prosesor dan peningkatan efisiensi algoritma. Algoritma Midpoint merupakan Algoritma dengan dasar operasi bilangan integer, sehingga memerlukan waktu operasi yanglebih sedikit dibandingkan dengan algoritma yang menggunakan operasi bilangan riel.
Implementasi ke dalam bahasa pemrograman C dari kedua macam algoritma diatas, menunjukkan bahwa waktu komputasi algoritma midpoint lebih cepat sebesar 8 kali pada pembuatan garis lurus, dan lebih cepat sebesar 15 kali pada penggambaran lingkaran, dibandingkan dengan waktu komputasi algoritma yang menggunakan dasar operasi bilangan riel. Dan waktu komputasi algoritma midpoint lebih cepat sebesar 6 kali pada pembuatan garis lurus, dibandingkan dengan waktu komputasi lgoritma yang Breserham telah menggunakan dasar operasi bilangan integer juga.
Kata kunci: Penggambaran garis, penggambaran kurva,
Algoritma Bresenham, Algoritma midpoint, Algoritma DDA.
1. PENDAHULUAN
Perkembangan kemampuan komputasi prosesor yang pesat telah membuatkomputer desktop mempunyai kemampuan komputasi yang besar. Hal inimendorong perkembangan program aplikasi yang memerlukan komputasi yangbesar seperti program aplikasi yang menggunakan grafik 3 dimensi.Peningkatan kemampuan komputasi prosesor untuk aplikasi grafik yangsarat komputasi, perlu dibarengi peningkatan efisiensi algoritma,sehingga pembuatan grafik garis dan kurva yang merupakan dasar pembuatangrafik dapat memberikan hasil yang optimal.
Algoritma midpoint merupakan algoritma pembuatan garis dan kurva dengan dasar operasi bilangan integer yang menonjolkan ciri kecepatan. Sehingga algoritma ini dapat dipakai sebagai algoritma pembuatan grafik yang menuntut kecepatan sebagai hal yang diutamakan. Pembahasan algoritma Midpoint dilakukan dengan mengasumsikan garis lurus dari kiri ke kanan,dan gadient antara 0 dan 1, sedangkan untuk lingkaran dengan mengasumsikan hanya sebagian lingkaran dengan sudut sebesar 45° , hal ini dilakukan untuk mempermudah penjelasan, sedangkan untuk kondisi yanglain dapat diderivasi dengan cara yang serupa. Untuk mendapatkan kinerja algoritma midpoint, dilakukan uji kecepatan komputasi dengan cara mengimplementasikan kedalam bahasa pemrograman C, dan melakukan perbandingan waktu komputasi dengan algoritma yang menggunakan dasar komputasi bilangan riel, maupun algoritma lain yang telah banyak dikenal seperti algoritma dda dan algoritma bressenham.
2. GARIS LURUS
Garis lurus dinyatakan dinyatakan dalam persamaan :
y = mx + c (1)
dimana : m : gradient dan
c : konstanta.
Untuk menggambarkan piksel-piksel dalam garis lurus, parameter yang digunakan tergantung dari gradient, jika besarnya gradient diantara 0 dan 1, maka digunakan sumbu x sebagai parameter dan sumbu y sebagai hasil dari fungsi, sebaliknya, bila gradient melebihi 1, maka sumbu y digunakan sebagai parameter dan sumbu x sebagai hasil dari fungsi, hal ini bertujuan untuk menghindari terjadinya gaps karena adanya piksel yang terlewatkan. Hasil dari fungsi biasanya merupakan bilangan riel, sedangkan koordinat pixel dinyatakan dalam bilangan integer (x,y), maka diperlukan operasi pembulatan kedalam bentuk integer terdekat. Penggambaran garis lurus dengan metode diatas dimulai dengan operasibilangan riel untuk menghitung gradient m dan konstanta c.
m = (y2 - y1 ) / (x2-x1) (2)
c = y1 ? m* x1* (3)
Operasi bilangan riel berikutnya adalah menghitung nilai y dengan persamaan (1) Untuk mendapatkan koordinat piksel (x,y), untuk setiapnilai x, dari =x1 sampai x=x2, operasi inilah yang perlu dihindari,karena operasi ini memerlukan waktu operasi yang besar.
2.1 Algoritma Bresenham
Bresenham pada tahun 1965, melakukan perbaikan dari algoritma perhitungan koordinat piksel yang menggunakan persamaan (1), dengan cara menggantikan operasi bilangan riel perkalian dengan operasi penjumlahan, yang kemudian dikenal dengan Algoritma Bresenham. Pada algoritma bresenham, nilai y kedua dan seterusnya, dihitung dari nilai y sebelumnya, sehingga hanya titik y pertama yang perlu dilakukan operasi secara lengkap. Perbaikan algoritma ini ternyata tidak menghasilkan perbaikan yang cukup siginifikan. Perbaikan berikutnya dilakukan dengan cara menghilangkan operasi bilangan riel dengan operasi bilangan integer. Operasi bilangan integer jauh lebih cepat dibandingkan dengan operasi bilangan riel, terutama pada penambahan dan pengurangan.
2.2 Algoritma Midpoint untuk Penggambaran Garis
Algoritma midpoint dikembangkan oleh Pitteway pada tahun 1967. Pada gambar 1, titik abu-abu menyatakan posisi piksel, titik hitam menyatakan posisi piksel yang telah digambar. Berdasarkan piksel ke n yang telah digambar, diperlukan metode untuk menentukan piksel berikut yang akan digambar, karena penggambaran dilakukan dari kiri ke kanan, maka piksel berikutnya harus pada kolom n+1. Karena gradien diantara 0 dan 1, maka piksel berikutnya adalah pada posisi titik p atau titik q.

Persamaan garis lurus yang telah dinyatakan dalam persamaan (1) dapat dinyatakan dalam fungsi x,y berikut.
*f(x, y) = ax + by + c = 0 *(4)
Fungsi f(x,y) dalam persamaan (4), akan memberikan nilai 0 pada setiap titik yang terletak pada garis, dan bernilai positip pada setiap titik yang terletak dibawah garis, dan bernilai negatif pada setiap titik yang terletak diatas garis. Maka untuk menentukan apakah titik P atau Q sebagai koordinat piksel berikutnya, maka dilakukan dengan cara menghitung nilai fungsi f(x,y) dalam persamaan (4) pada titik P dan titik Q . Jika fungsi f(x,y) tersebut memberikan nilai positif, maka piksel berikutnya adalah Q, sebaliknya piksel berikutnya adalah P.
*g(x, y) = f(xn + 1, yn + 1/2) *(5)
Fungsi g(x,y) persamaan (5) merupakan variabel penentu, dengan mengevaluasi g (x, y) dapat ditentukan piksel berikutnya yang mana berdasarkan tanda plus atau minus dari hasil fungsi g(x,y). Untuk mempercepat komputasi fungsi g(x,y), dilakukan dengan cara incremental berdasarkan nilai sebelumnya. Untuk setiap piksel, increment sederhana (DeltaG) dipakai sebagai variabel penentu. Karena hanya ada 2 pilihan piksel pada setiap tahap, maka hanya ada 2 increment yang dapat digunakan. Hal ini dilakukan dengan cara pengurangan nilai g(x,y) yang berurutan dengan menggunakan persamaan 4 dan persamaan 5.
*DeltaG = a * DeltaX + b * DeltaY *(6)
Dimana DeltaX dan DeltaY adalah increment yang dipakai pada x dan y, yang bernilai 0 atau 1. Bila bergeser 1 piksel ke kanan :
*DeltaG1 = a* (7)
Bila bergeser 1 piksel ke kanan dan 1 piksel ke atas.
*DeltaG2 = a + b *(8)
Jadi nilai dari variable penentu dapat dihitung dari nilai sebelumnya dengan cara menambah dengan (a) atau (a+b). Algoritma untuk menggambar garis lurus dari (x1, y1) sampai (x2, y2) dilakukan dengan langkah-langkah sebagai-berikut:
1. Gambar piksel pertama (x1,y1). Hitung variabel penentu dengan persamaan (3).
2. Tentukan tanda variabel penentu. Jika variabel penentu bernilai positif, increment x dan y dan tambahkan (a+b) pada vaiabel penentu, sebaliknya increment x dan y dan tambahkan (a) pada variabel penentu.
3. Plot piksel pada posisi (x, y).
4. Ulangi langkah mulai langkah kedua, sampai piksel terakhir (x2,y2).
3. LINGKARAN
Kurva lingkaran dinyatakan dinyatakan dalam persamaan :
*(x-xc) ^2 + (y-yc) ^2 = r ^2 *(9)
dimana : (xc,yc) : koordinat titik pusat lingkaran
r : jari-jari lingkaran
Untuk menggambarkan piksel-piksel dalam kurva lingkaran, dapat digunakan sumbu x dari x = (xc-r) sampai x = (xc+r) sebagai parameter dan sumbu y sebagai hasil dari persamaan (10)
*y = yc +- sqrt(r ^2 - (x-xc) ^2 *(10)
Algoritma ini memerlukan waktu operasi yang besar, karena mengandung operasi bilangan riel perkalian maupun eksponential, dan menghasilkan posisi koordinat piksel yang tidak merata, karena terjadinya gaps yang disebabkan adanya perubahan gradient.
Untuk menghindari posisi koordinat piksel yang tidak merata, koordinat piksel (x,y) dinyatakan dengan menggunakan koordinat polar dalam persamaan (11)
*x = xc + r cos q *(11a)
*y = yc + r sin q *(11b)
Persamaan (11) diatas mengandung operasi bilangan riel perkalian untuk mendapatkan koordinat piksel (x,y), untuk setiap nilai x, dari x = (xc-r) sampai x = (xc+r), operasi inilah yang perlu dihindari, karena operasi ini memerlukan waktu operasi yang besar.
3.1 Algoritma Midpoint
Komputasi untuk membuat kurva lingkaran dimulai dengan mengidentifikasi bagian-bagian dari lingkaran yang dapat ditentukan dengan menggunakan sifat simetri, hal ini dilakukan dengan cara membagai lingkaran dengan masing-masing mempunyai sudut sebesar 45° , sehingga dalam sebuah lingkaran dibagi menjadi 8 bagian. Sebagai contoh, digambarkan bagian dari lingkaran dari sudut 90° sampai 45° . Seperti pada algoritma midpoint untuk garis lurus, maka pada setiap tahapan, terdapat 2 koordinat piksel yang harus dipilih yaitu (x+1, y) atau (x+1, y-1).
Gambar 2. Lingkaran
Langkah berikutnya, adalah menyatakan persamaan lingkaran dan fungsi untuk menentukan variabel penentu. Persamaan lingkaran dengan pusat (0,0) dinyatakan dalam persamaan (12).
*f(x, y) = x*x + y+y - r*r = 0 *(12)
Fungsi f(x, y) persamaan (12) akan bernilai positif jika titik (x,y) diluar lingkaran, dan bernilai negatif jika titik (x,y) didalam lingkaran. Fungsi untuk variabel penentu dan increment dinyyatakan dalam persamaan (13), (14), dan (15).
g(x, y) = (x + 1) (x + 1) + (y - 1/2) (y - 1/2) - r*r (13)
*DeltaG1 = 2x + 3 (14)
*DeltaG2 = 2x - 2y + 5 (15)
Berbeda dengan nilai dari increment pada algoritma garis lurus yang bernilai konstan, pada kurva lingkaran, increment tidak konstan. Terlihat bahwa komputasi increment memerlukan operasi perkalian, tetapi operasi perkalian dapat diubah dengan cara komputasi nilai increment secara increment pula, sehingga diperlukan 2 komputasi increment dalam setiap piksel yang diproses. Secara umum, kurva polinomial orde n memerlukan n level increment. Pada titik awal (x1,y1), komputasi variabel penentu mempunyai bagian bilangan riel, sehingga operasi bilangan integer tidak dapat digunakan secara langsung.
Dalam praktek hal ini diselesaikan dengan cara menambahkan nilai 1/4 pada variable penentu. Hal ini tidak mempengaruhi perubahan tanda bilangan, karena operasi yang dilakukan adalah operasi bilangan integer, sehingga menghasilkan operasi yang lebih cepat.

KESIMPULAN
Panjang garis atau banyak piksel dalam garis lurus sangat berpengaruh terhadap perbandingan performance antara sebuah algoritma dengan algoritma yang lain, hal ini disebabkan adanya perbedaan waktu operasi yang berada didalam perulangan sepanjang pembuatan piksel, dan waktu operasi yang berada pada sebelumnya. Panjang jari-jari dalam lingkaran tidak berpengaruh terhadap perbandingan performance antara sebuah algoritma dengan algoritma yang lain, hal ini menunjukkan perbandingan waktu operasi yang berada didalam perulangan sepanjang pembuatan piksel, dan waktu operasi yang berada pada sebelumnya berimbang.
Algoritma dengan dasar operasi bilangan integer memberikan waktu operasi yang lebih cepat dibandingkan dengan algoritma dengan dasar operasi bilangan riel, hal ini ditunjukkan dengan waktu komputasi algoritma DDA, algoritma Bresenham dan algoritma Midpoint yang lebih cepat, baik pada pembuatan garis lurus maupun lingkaran dibandingan waktu komputasi dengan algoritma yang menggunakan dasar operasi bilangan riel. Algoritma midpoint memberikan waktu operasi tercepat diantara algoritma penggambaran garis lurus yang telah menggunakan dasar operasi bilangan integer, seperti algoritma DDA, algoritma Bresenham. Jadi algoritma Midpoint merupakan algoritma yang cocok untuk penggambaran grafik yang menuntut kecepatan sebagai hal yang diutamakan.

Download Artikel Lengkap (pdf)

unit Unit1;

interface

uses
Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls, Forms,
Dialogs, StdCtrls, ExtCtrls;

type

TForm1 = class(TForm)
Button1: TButton;
Label1: TLabel;
Label2: TLabel;
Label3: TLabel;
Label4: TLabel;
ColorDialog1: TColorDialog;
Button2: TButton;
Panel1: TPanel;
Button3: TButton;
Image1: TImage;
Label5: TLabel;
procedure Button1Click(Sender: TObject);
procedure Button2Click(Sender: TObject);
procedure Image1MouseDown(Sender: TObject; Button: TMouseButton;
Shift: TShiftState; X, Y: Integer);
procedure Panel1Click(Sender: TObject);
procedure Button3Click(Sender: TObject);
private
{ Private declarations }
public
{ Public declarations }
end;

var
Form1: TForm1;
var x1,x2,y1,y2:Integer;

var klik:Boolean;
implementation

{$R *.dfm}

procedure TForm1.Button1Click(Sender: TObject);
var i,j:Integer;
var m,b :Real;

begin
m:=(y2 - y1) / (x2 - x1);
b:=y1 - m * x1;
if x1 <> x2 then
begin
for i:=x2 to x1 do
begin
j:= round(m * i + b);
image1.Canvas.Pixels[i,j]:=Panel1.Color;
end;
end;
end;

procedure TForm1.Button2Click(Sender: TObject);
begin
image1.Canvas.FillRect(Image1.ClientRect);
end;

procedure TForm1.Image1MouseDown(Sender: TObject; Button: TMouseButton;
Shift: TShiftState; X, Y: Integer);
begin
if klik=False then
begin
x1:=x;
y1:=y;
klik:=True;
end
else if klik=true then
begin
x2:=x;
y2:=y;
klik:=false;
end;
image1.Canvas.Pixels[x,y]:=Panel1.Color;

label1.Caption:=IntToStr( x1);
label2.Caption:=IntToStr(y1);
label3.Caption:=IntToStr( x2);
label4.Caption:=IntToStr(y2);
end;

procedure TForm1.Panel1Click(Sender: TObject);
begin
if ColorDialog1.Execute then Panel1.Color:=ColorDialog1.Color;
end;

procedure TForm1.Button3Click(Sender: TObject);
begin
Application.Terminate;
end;
end.

Download Program Lengkap

Kelompok 2 program 3 dimensi

2009-02-08T03:20:00.000-08:00

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

dan sudut pandang serta dapat dilihat pula dalam bentuk kerangka (wire

frame) maupun solid dengan demikian apa yang terlihat lebih mendekati

pada obyek yang sesungguhnya.

Transformasi pada obyek tiga dimensi

Pada obyek tiga dimensi dapat dilakukan 3 transformasi pokok yaitu

penggeseran (translation), perputaran (rotasi) , pembesaran (scaling).

Adapun jenis transformasi lain adalah pembebanan (shearing), dan

pencerminan (mirroring). Didalam program, transformasi ini juga dapat

dilakukan dengan mengubah persamaan menjadi operasi matriks 4x4.

Adapun persamaan setiap transformasi adalah sebagai berikut.

1. Penggeseran (translation)

( x’, y’,z’ ) = ( Tx +x, Ty +y, Tz +z)

dengan x’,y’, z’ : koordinat hasil transformasi

x,y,z : koordinat titik awal

Tx,Ty, Tz : faktor penggeseran kearah x, y, z

2. Pembesaran (scaling)

( x’,y’,z’ ) = (Sx *x, Sy *y, Sz *z)

dengan Sx,Sy, Sz : faktor pembesaran kearah x, y, z

3. Perputaran (rotation)

a) terhadap sumbu x

( x’,y’, z’ ) = (x , y *cos q +z*sinq, - y *sinq+z*consq)

b) terhadap sumbu y

( x’,y’,z’ ) = ( x *cos q +z*sinq,y , - x *sinq+z*consq)

c) terhadap sumbu z

(x’,y’, z’ ) = ( x *cos q +y*sinq, - x*sinq+y*consq , z )

dengan q : sudut putar berlawanan arah jarum jam

Teknik penampilan obyek 3 dimensi

Pada sistem dua dimensi obyek gambar dua dimensi dapat langsung di

aplikasikan pada layar karena memiliki dimensi yang sama, kalaupun ada

perbedaan hanya pada arah sumbunya. Koordinat Cartesian memiliki sumbu

y arah ke atas, sedangkan koordinat layar sumbu y ke arah bawah. Akan

tetapi dengan sedikit modifikasi atau menggunakan fungsi bahasa

pemrograman tertentu misalnya Borland C++ 4.0 keatas dengan fungsi

terpasang, koordinat layar dapat disesuaikan dengan kordinat kartesian

dengan sumbu y ke arah atas.

Pada sistem tiga dimensi setiap titik memiliki 3 koordinat yaitu koordinat

x, y, dan z, sedangkan layar hanya memiliki sumbu x dan y. Oleh karena itu

diperlukan transformasi dari koordinat tiga dimensi atau disebut dengan

koordinat dunia menjadi koordinat dua dimensi.

Beberapa metode untuk menampilkan efek tiga dimensi pada layar dua

dimensi selain metode kamera sintetis yaitu proyeksi paralel, dan proyeksi

perspektif.

a. Proyeksi paralel

Proyeksi paralel merupakan teknik dasar untuk penyajian obyek tiga

dimensi pada layar dua dimensi, yang bertumpu pada 3 sudut pandang.

Pandangan depan, pandangan samping dan pandangan atas. Contoh

proyeksi paralel seperti pada gambar 1.

Untuk menggambarkan proyeksi paralel dalam tiga dimensi

diperlukan beberapa sudut pandang minimal atas, samping dan depan

kemudian di proyeksikan dalam koordinat tiga dimensi sehingga seperti

terlihat pada :

Proyeksi parallel merupakan teknik yang relatif sederhana tetapi

gambar yang ditampilkan masih sulit untuk dibayangkan sebagai image

tiga dimensi, seperti pada gambar 1. Untuk itu dikembangkan cara lain

yaitu dengan teknik proyeksi perspektif seperti pada gambar 2.

b. Proyeksi perspektif

Proyeksi perspektif adalah bentuk gambar tiga dimensi seperti

yang dilihat pada kenyataan sesungguhnya seperti yang terlihat oleh

mata manusia ataupun kamera. Teknik ini lebih menggambarkan

keadaan yang sesungguhnya tetapi untuk obyek dalam bentuk gambar

rangka ( wire frame) untuk kedalaman tertentu dapat menimbulkan

dualisme gambar. Misalnya bagian yang terkesan didalam kadang-kadang

juga terkesan di luar.

unit Main;

interface

uses
Windows, Messages, SysUtils, Classes, Graphics, Controls, Forms, Dialogs,
OpenGL, MyOpenGL, Mesh, StdCtrls, ExtCtrls, ComCtrls,Transf3D;

type
TForm1 = class(TForm)
Panel1: TPanel;
GroupBox1: TGroupBox;
ETRZ: TEdit;
ETRY: TEdit;
ETRX: TEdit;
Trx: TLabel;
Label1: TLabel;
Label2: TLabel;
TranslasiBtn: TButton;
GroupBox2: TGroupBox;
Label3: TLabel;
Label4: TLabel;
Label5: TLabel;
ESZ: TEdit;
ESY: TEdit;
ESX: TEdit;
SkalaBtn: TButton;
GroupBox3: TGroupBox;
Label7: TLabel;
Label8: TLabel;
Label9: TLabel;
Label10: TLabel;
ERZ: TEdit;
ERY: TEdit;
ERX: TEdit;
RotasiBtn: TButton;
ESudut: TEdit;
VertexView: TListView;
Label6: TLabel;
Memo1: TMemo;
procedure FormCreate(Sender: TObject);
procedure FormPaint(Sender: TObject);
procedure TranslasiBtnClick(Sender: TObject);
procedure SkalaBtnClick(Sender: TObject);
procedure RotasiBtnClick(Sender: TObject);
procedure FormResize(Sender: TObject);
private
{ Private declarations }
ftrx, ftry, ftrz:real;
frx, fry, frz:real;
fsx,fsy,fsz:real;
fsudut:real;
fmode_transformasi:byte;
fKubus:TKubus;
fTransf:TTransf3D;
procedure AmbilVertex;
procedure TransformVertex;
public
{ Public declarations }
end;

var
Form1: TForm1;

implementation

{$R *.DFM}

const
TRANSF_TRANSLASI = 0;
TRANSF_ROTASI = 1;
TRANSF_SKALA = 2;

procedure TForm1.TransformVertex;
var
index:integer;
vp,v:TVertex3D;
begin
for index:=0 to fKubus.VertexCount-1 do
begin
v:=fKubus.Vertex[index];
fTransf.Transform(v.vertex, vp.vertex);
fKubus.ChangeVertex(index,vp.vertex.x, vp.vertex.y, vp.vertex.z);
end;
end;

procedure TForm1.AmbilVertex;
var
index:integer;
item:TListItem;
begin
//bersihkan VertexView
VertexView.Items.Clear;
for index:=0 to fKubus.VertexCount-1 do
begin
item:=VertexView.Items.Add;
with fKubus do
begin
item.Caption:= Format('%2.2f',[Vertex[index].vertex.x]);
item.SubItems.Add(Format('%2.2f',[Vertex[index].vertex.y]));
item.SubItems.Add(Format('%2.2f',[Vertex[index].vertex.z]));
end;
end;
end;

procedure TForm1.FormCreate(Sender: TObject);
begin
fKubus:=TKUbus.Create(true,true,1.0,1.0,0.0);
fKubus.ChangeColor(KUBUS_ATAS,1.0,0.0,0.0);
fTransf:=TTransf3D.Create;

ftrx:=0; ftry:=0; ftrz:=0;
frx:=0; fry:=0; frz:=0;
fsx:=0; fsy:=0; fsz:=0;
fmode_transformasi:=9;

glDC:=GetDC(Handle);
InitOpenGL(glDC);
Axis3D:=TAxis3D.Create;
glEnable(GL_DEPTH_TEST);
// glPolygonMode(GL_FRONT_AND_BACK,GL_LINE);

glViewport(Panel1.Width,0,Width-Panel1.Width,Height-Memo1.Height);

glMatrixMode(GL_PROJECTION);
glLoadIdentity;

gluPerspective(45, (width - Panel1.Width)/height,1.0, 100.0);
gluLookAt(3.0, 2.0, 3.0,
0.0, 0.0, 0.0,
0.0, 1.0, 0.0);
glMatrixMode(GL_MODELVIEW);
glLoadIdentity;
end;

procedure TForm1.FormPaint(Sender: TObject);
var
index:integer;
v,vp:TPoint3D;
begin
glClearCOlor(0.0, 0.0, 0.0, 0.0);
glClear(GL_COLOR_BUFFER_BIT or GL_DEPTH_BUFFER_BIT);

fKubus.Draw;
Axis3D.Draw;
glFlush;
//update daftar vertex
AmbilVertex;
end;

procedure TForm1.TranslasiBtnClick(Sender: TObject);
begin
ftrx:=StrToFloat(ETRX.Text);
ftry:=StrToFloat(ETRY.Text);
ftrz:=StrToFloat(ETRZ.Text);
fmode_transformasi:=TRANSF_TRANSLASI;
fTransf.ClearTransformation;
fTransf.Translation(ftrx,ftry,ftrz);
TransformVertex;
Repaint;
end;

procedure TForm1.SkalaBtnClick(Sender: TObject);
begin
fsx:=StrToFloat(ESX.Text);
fsy:=StrToFloat(ESY.Text);
fsz:=StrToFloat(ESZ.Text);
fmode_transformasi:=TRANSF_SKALA;
fTransf.ClearTransformation;
fTransf.Scaling(fsx,fsy,fsz,0,0,0);
TransformVertex;
Repaint;
end;

procedure TForm1.RotasiBtnClick(Sender: TObject);
begin
frx:=StrToFloat(ERX.Text);
fry:=StrToFloat(ERY.Text);
frz:=StrToFloat(ERZ.Text);
fsudut:=StrToFloat(ESudut.Text);
fmode_transformasi:=TRANSF_ROTASI;
fTransf.ClearTransformation;
fTransf.Rotation(fsudut,frx,fry,frz);
TransformVertex;
Repaint;
end;

procedure TForm1.FormResize(Sender: TObject);
begin
glViewport(Panel1.Width,0,Width-Panel1.Width,Height);

glMatrixMode(GL_PROJECTION);
glLoadIdentity;

gluPerspective(45, (width - Panel1.Width)/height,1.0, 100.0);
gluLookAt(8.0, 4.0, 9.0,
0.0, 0.0, 0.0,
0.0, 1.0, 0.0);
glMatrixMode(GL_MODELVIEW);
glLoadIdentity;
Repaint;
end;

end.

Download Program Lengkap

kelompok 2 Program 2 dimensi

2009-02-08T03:05:00.000-08:00

Transformasi dua dimensi
Dasar Teori

Viewport
Objek yang akan digambar pada layar biasanya memiliki ukuran yang jauh lebih besar dibanding ukuran layar, sehingga perlu dilakukan pemetaan/transformasi yang memungkinkan objek tersebut bisa digambar pada layar. Meskipun demikian, objek seringkali terlalu rumit untuk ditampilkan pada layar dengan koordinat yang sangat terbatas. Sehingga biasanya kita memilih bagian tertentu dari objek untuk ditampilkan pada layar. Didalam memilih objek yang akan ditampilkan biasanya dibatasi oleh sebuah kotak yang disebut dengan jendela (window).
Dalam praktek kita bisa menggunakan seluruh atau sebagian lebar layar untuk menmpilkan objek yang berada pada sebuah jendela. Daerah layar yang dipilih untuk menampilkan objek yang dimaksud disebut viewport. Dalam keadaan normal, viewport akan meliputi seluruh layar lebar. Meskipun demikian, kita bisa memilih bagian tertentu dari layar untuk dijadikan sebuah viewport.
Transformasi
Sejumlah objek seringkali mempunyai sifat simetri. Sehingga untuk menggambar seluruh objek, cukup dilaksanakan dengan melakukan manipulasi 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 Qx=Px +trx =10 + 10 =20
Qy=Py + try =10+20=30
Hasil translasi A = (20, 30)
Titik B Qx=Px + trx = 30+10 = 40
Qy=Py + try = 10+20 =30
Hasil translasi B = (40, 30)

2. Rotasi
Kita bisa memutar objek searah dengan arah perputaran jarum jam(dinyatakan dengan sudut negatif) atau berlawanan arah dengan arah jarum jam(dinyatakan sebagai sudut positif).
Dengan menganggap bahwa besarnya sudut putar adalah sama dengan , maka posisi sebuah titik yang baru adalah:
Qx = Pxcos( ) - Pysin( )
Qy = Pxsin( ) + Pycos( )
Dengan menggunakan notasi matrix, maka besaran M bisa dikatakan sbb:
M = cos(0) sin(0)
-sin(0) cos(0)

3. Skala
Penskalaan adalah proses untuk memperbesar atau memperkecil suatu gambar. Dengan faktor absolut yang lebih besar dari 1, akan diperoleh gambar yang lebih besar dan semakin menjauh dari titik(0,0). Sebaliknya dengan faktor skala yang mempunyai nilai absolut lebih kecill dari 1, akan diperoleh gambar yang lebih kecil dan mendekat ke titik (0,0).
Dengan menggunakan persamaan Q=PM+tr, maka hasil penggeseran bisa dinyatakan sebagai:
(Qx, Qy)=(SxPx, SyPy)
Dengan Sx adalah faktor skala ke arah mendatar dan Sy adalah faktor skala arah tegak dan ofset vektor tr bernilainol. Dengan menggunakan notasi matrix, maka matrixM bisa dinyatakan sbb:
M= (sx 0)
(0 sy)

Download Artikel Lengkap (pdf)

unit Main;

interface

uses
Windows, Messages, SysUtils, Classes, Graphics, Controls, Forms, Dialogs,
StdCtrls, ExtCtrls,Math;

const
MAX_VERTEX = 3;
type
TPointFloat = record
x,y:real;
end;

TMainFrm = class(TForm)
Panel1: TPanel;
GroupBox3: TGroupBox;
Label7: TLabel;
Label9: TLabel;
Label10: TLabel;
EDeg: TEdit;
RotasiBtn: TButton;
ECRX: TEdit;
ECRY: TEdit;
GroupBox1: TGroupBox;
Label1: TLabel;
Label2: TLabel;
ETrx: TEdit;
ETry: TEdit;
TranslasiBtn: TButton;
procedure FormCreate(Sender: TObject);
procedure FormPaint(Sender: TObject);
procedure FormResize(Sender: TObject);
procedure TranslasiBtnClick(Sender: TObject);
procedure PenskalaanBtnClick(Sender: TObject);
procedure RotasiBtnClick(Sender: TObject);
private
{ Private declarations }
Segitiga:array[1..MAX_VERTEX] of TPointFloat;
xcenter,ycenter:integer;
procedure GambarSegitiga;
procedure IsiSegitiga;
procedure Translasi(px,py,tr_x,tr_y:real;var qx,qy:real);
procedure Skala(px,py,sx,sy:real;var qx,qy:real);
procedure Rotasi(px,py,deg:real;var qx,qy:real);
public
{ Public declarations }
end;

var
MainFrm: TMainFrm;

implementation

{$R *.DFM}
procedure TMainFrm.IsiSegitiga;
begin
segitiga[1].x:= 100;
segitiga[1].y:= -100;
segitiga[2].x:= 300;
segitiga[2].y:= -100;
segitiga[3].x:= 300;
segitiga[3].y:= 150;
end;

procedure TMainFrm.Translasi(px,py,tr_x,tr_y:real;var qx,qy:real);
begin
qx:=px+tr_x;
qy:=py+tr_y;
end;

procedure TMainFrm.Skala(px,py,sx,sy:real;var qx,qy:real);
begin
qx:=px*sx;
qy:=py*sy;
end;

procedure TMainFrm.Rotasi(px,py,deg:real;var qx,qy:real);
var
radian:real;
cosdeg,sindeg:real;
begin
radian:=degtorad(deg) ; //deg * Pi / 180;
cosdeg:=cos(radian);
sindeg:=sin(radian);
qx:=px * cosdeg - py * sindeg;
qy:=py * cosdeg + px * sindeg;
end;

procedure TMainFrm.GambarSegitiga;
var
index:integer;
x,y:real;
begin
Canvas.Rectangle(0,Panel1.Height,Width,Height);
Canvas.Pen.Style:=psSolid;
for index:=1 to MAX_VERTEX+1 do
begin
if index = MAX_VERTEX+1 then
begin
x:=xcenter+Segitiga[1].x;
y:=ycenter-Segitiga[1].y;
end
else
begin
x:=xcenter+Segitiga[index].x;
y:=ycenter-Segitiga[index].y;
end;
if index = 1 then
Canvas.MoveTo(round(x),round(y))
else
Canvas.LineTo(round(x),round(y));
end;
Canvas.Pen.Style:=psDot;
Canvas.MoveTo(xcenter,0);
Canvas.LineTo(xcenter,Height);
Canvas.MoveTo(0,ycenter);
Canvas.LineTo(Width,ycenter);
end;

procedure TMainFrm.FormCreate(Sender: TObject);
begin
xcenter:=Width div 2;
ycenter:=Panel1.Height+((Height-Panel1.Height) div 2);

IsiSegitiga;
GambarSegitiga;
end;

procedure TMainFrm.FormPaint(Sender: TObject);
begin
GambarSegitiga;
end;

procedure TMainFrm.FormResize(Sender: TObject);
begin
xcenter:=Width div 2;
ycenter:=Panel1.Height+((Height-Panel1.Height) div 2);
GambarSegitiga;
end;

procedure TMainFrm.TranslasiBtnClick(Sender: TObject);
var
px,py:real;
tr_x,tr_y:integer;
index:integer;
qx,qy:real;
begin
//ambil nilai trx,try
tr_x:=StrToInt(ETrx.Text);
tr_y:=StrToInt(ETry.Text);
for index:=1 to 3 do
begin
//ambil lokasi titik
px:=Segitiga[index].x;
py:=Segitiga[index].y;
//translasikan
Translasi(px,py,tr_x,tr_y,qx,qy);
//simpan kembali
Segitiga[index].x:=qx;
Segitiga[index].y:=qy;
end;
GambarSegitiga;
end;

procedure TMainFrm.PenskalaanBtnClick(Sender: TObject);

begin

end;

procedure TMainFrm.RotasiBtnClick(Sender: TObject);
var
px,py,xt,yt:real;
qx,qy,deg:real;
index:integer;
begin
//ambil sx,sy
deg:=StrToFloat(EDeg.Text);
//ambil pusat transformasi
xt:=StrToFloat(ECRx.Text);
yt:=StrToFloat(ECRy.Text);
for index:=1 to MAX_VERTEX do
begin
//ambil lokasi
px:=Segitiga[index].x;
py:=Segitiga[index].y;
if (xt <> 0 ) and (yt <> 0 ) then
begin
//translasi -trx,-try
Translasi(px,py,-xt,-yt,qx,qy);
end
else
begin
qx:=px;
qy:=py;
end;
//skalakan sx,sy
Rotasi(qx,qy,deg,qx,qy);
if (xt <> 0 ) and (yt <> 0 ) then
begin
//translasi trx,try
Translasi(qx,qy,xt,yt,qx,qy);
end;
//simpan
Segitiga[index].x:=qx;
Segitiga[index].y:=qy;
end;
//gambar ulang
GambarSegitiga;
end;

end.

Download Program 2 Dimensi

Kelompok 3 Transformasi 2D

2009-01-31T21:57:00.000-08:00

Struktur Titik dan Vektor

Slide 3

Struktur data dari titik 2D

typedef struct {

float x,y;

} point2D_t;

Sturktur Data dari vektor 2D

typedef struct {

float v[3];

} vector2D_t;

Perubahan Titik dan Vektor

Point2Vector

Slide 5

Fungsi ini digunakan untuk memindahkan tipe data titik menjadi tipe data vektor. Hal ini sangat berguna untuk operasional matrik yang digunakan dalam melakukan transformasi dan pengolahan matrik pada grafika komputer.

vector2D_t point2vector(point2D_t pnt)

{

vector2D_t vec;

vec.v[0]=pnt.x;

vec.v[1]=pnt.y;

vec.v[2]=1.;

}

Vector2 Point

Fungsi ini digunakan untuk memindahkan tipe data vektor menjadi tipe data titik. Hal ini sangat berguna untuk penyajian grafis setelah proses pengolahan matrik yang dikenakan pada obyek 2D.

point2D_t vector2point(vector2D_t vec)

{

point2D_t pnt;

pnt.x=vec.v[0];

pnt.y=vec.v[1];

}

Matrik Transformasi 2D

Matrik transformasi adalah matrik yang membuat sebuah obyek mengalami perubahan baik berupa perubahan posisi, maupun perubahan ukuran.
Matrik transformasi 2D dinyatakan dalam ukuran 3x3, dimana kolom ke-3 digunakan untuk menyediakan tempat untuk proses translasi.

Translasi

Translasi adalah perpindahan obyek dari titik P ke titik P’ secara linier.

x’ = x + dx

y’ = y + dy

Model Matrik

Matrik Transformasi dari Translasi 2D

Implementasi Matrik Tranformasi Untuk Translasi

matrix2D_t translationMTX(float dx,float dy)

{

matrix2D_t trans=createIdentity();

trans.m[0][2]=dx;

trans.m[1][2]=dy;

return trans;

}

Scaling

Scaling m adalah perpindahan obyek dari titik P ke titik P’, dimana jarak titik P’ adalah m kali titik P

Matrik Transformasi
dari Scaling 2D

Proses scaling dengan menggunakan definisi vektor2D dapat dituliskan dengan

Matrik Transformasi dari Scaling

Implementasi Matrik Tranformasi Untuk Scaling

matrix2D_t scalingMTX(float mx,float my)

{

matrix2D_t scale=createIdentity();

scale.m[0][0]=mx;

scale.m[1][1]=my;

return scale;

}

Rotasi

Rotasi adalah perpindahan obyek dari titik P ke titik P’, yang berupa pemindahan berputar sebesar sudut q

Matrik Transformasi dari Rotasi

Implementasi Matrik Tranformasi Untuk Rotasi

matrix2D_t rotationMTX(float theta)

{

matrix2D_t rotate=createIdentity();

float cs=cos(theta);

float sn=sin(theta);

rotate.m[0][0]=cs; rotate.m[0][1]=-sn;

rotate.m[1][0]=sn; rotate.m[1][1]=cs;

return rotate;

}

Perkalian Matrik

Perkalian matrik dengan matrik menghasilkan matrik
Perkalian matrik dengan vektor menghasilkan vektor

Perkalian matrik ini digunakan untuk operasional transformasi dari obyek 2D dan untuk komposisi (menggabungkan) tranformasi

Perkalian Matrik dengan Matrik

Perkalian matrik a dan matrik b menghasilkan matrik c yang dirumuskan dengan

dimana i dan j bernilai 0 s/d 2

Implementasi Perkalian
Matrik dengan Matrik

matrix2D_t operator * (matrix2D_t a, matrix2D_t b)

{

matrix2D_t c;//c=a*b

int i,j,k;

for (i=0;i<3;i++) j="0;j<3;j++)">

c.m[i][j]=0;

for (k=0;k<3;k++)>

c.m[i][j]+=a.m[i][k]*b.m[k][j];

}

return c;

}

Perkalian Matrik dengan Vektor

Perkalian matrik a dan vektor b menghasilkan vektor c yang dirumuskan dengan

dimana i bernilai 0 s/d 2

Implementasi Perkalian Matrik dengan Vektor

vector2D_t operator * (matrix2D_t a, vector2D_t b)

{

vector2D_t c;//c=a*b

int i,j;

for (i=0;i<3;i++)>

c.v[i]=0;

for (j=0;j<3;j++)>

c.v[i]+=a.m[i][j]*b.v[j];

}

return c;

}

Komposisi Transformasi

Komposisi transformasi adalah menggabungkan beberapa tranformasi, sehingga dapat menghasilkan bentuk transformasi yang lebih kompleks

Komposisi tranformasi dapat dilakukan dengan mengalikan matrik-matrik transformasi

Contoh program dengan menggunakan Delphi7

Download Materi Lengkap disini
Download Sample Program disini
Download Program source disini

Kelompok 1

2009-01-31T02:13:00.000-08:00

nama kelompok :

lidya wati
wulan hernawati
sri kurniasih
raghyl sasmitha
suharjono
gigih prananto
tri murwono
arifai

GAMBAR TRANFORMASI 2D

unit Unit1;

interface

uses
Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls, Forms,
Dialogs, StdCtrls, jpeg, ExtCtrls;

type
TForm1 = class(TForm)
Button1: TButton;
Image1: TImage;
procedure Button1Click(Sender: TObject);
private
{ Private declarations }
public
{ Public declarations }
end;

var
Form1: TForm1;

implementation

{$R *.dfm}

procedure TForm1.Button1Click(Sender: TObject);
var
a:Integer;
therect:TRect;
begin
for a:=1 to 100 do

begin
Canvas.Pixels[300+a,300]:=clBlack;
Canvas.Pixels[300-a,300]:=clblack;
Canvas.Pixels[400+a,300]:=clBlack;

Canvas.Pixels[200-a,300-a]:=clBlack;
Canvas.Pixels[500+a,300-+a]:=clBlack;

Canvas.Pixels[200+a,200]:=clBlack;
Canvas.Pixels[200-a,200]:=clBlack;
Canvas.Pixels[500+a,200]:=clBlack;
Canvas.Pixels[300+a,200]:=clblack;
Canvas.Pixels[400+a,200]:=clblack;

Canvas.Pixels[350,100+a]:=clblack;

Canvas.Pixels[450-a,200-a]:=clBlack;
Canvas.Pixels[250+a,200-a]:=clBlack;

Canvas.Pixels[340+a,270]:=clBlack;
Canvas.Pixels[340-a,270]:=clBlack;
Canvas.Pixels[428+a,270]:=clBlack;
Canvas.Pixels[170+a,270]:=clBlack;

///Canvas.Pixels[100+a,100]:=clBlack;
end;
end;
end.

Kelompok 3 Lingkaran Bresenham

2009-01-29T08:14:00.000-08:00

LINGKARAN BRESENHAM

Algoritma lingkaran bresenham memerlukan menggambar pada octant yang pertama saja sedangkan titik-titik pada kuadran lain dapat diperoleh pada pencerminan titik-titik pada oktan pertama.

Pembuatan suatu lingkaran merupakan salah satu primitive yang berperan dalam grafika komputer. Prinsip yang dipakai pada penelitian ini dalam pembuatan lingkaran adalah menterjemahkan dari bahasa matematika ke dalam bahasa pemrograman untuk metode Bezier dan algoritma Bresenham. Untuk program-program terapan sederhana, lingkaran yang diperoleh dari bentuk dasar kurva cukup memadai, tetapi seringkali diinginginkan bentuk lingkaran yang jauh lebih rumit dan tidak teratur. Bentuk fungsi matematis yang paling utama untuk menggambar kurva sebagai dasar pembuatan bentuk lingkaran adalah fungsi parametrik atau vector-valued function yaitu untuk sembarang titik pada suatu permukaan, lokasinya ditentukan oleh dua buah parameter u dan v biasanya bernilai antara 0 dan 1, dan fungsi parametrik x,y, dan z merupakan lokasi-lokasi titik pada kurva atau permukaan. Algoritma de Casteljau [2] merupakan algoritma untuk membuat kurva menggunakan sejumlah titik kontrol, dan menggunakan teknik in-betweening untuk mendapatkan kurva yang diinginkan. Algoritma ini dikembangkan oleh P. de Casteljau, dan merupakan cikal bakal kurva Bezier, yang secara terpisah dikembangkan lebih lanjut oleh P. Bezier. Algoritma de Casteljau untuk membuat kurva Bezier cukup ampuh secara algoritmik, tetapi tidak secara eksplisit menyatakan bentuk fungsionalnya. Karena alasan ini, kemudian dikembangkan persamaan lain untuk membuat kurva Bezier, yang sangat berguna untuk tujuan analisis.

Algoritma Bresenham dipilih karena merupakan metode dasar grafis yang sangat populer dan terkenal efisiensinya, Bresenham memakai dasar integer arithmetic yang jauh lebih cepat daripada floating-point arithmetic yang biasa dipakai dan menggunakan suatu persamaan matematis untuk mengetahui adanya baris atau kolom baru yang akan dibuat dalam proses pembuatan suatu garis. Tetapi Bresenham juga memiliki kekurangan yaitu timbulnya error jika dua segmen garis yang overlap dibuat, error juga akan timbul jika sebuah segmen garis yang intensitasnya berbeda overlap terhadap suatu segment garis yang sudah ada.

Algoritma Bresenham menggunakan aritmatika integer yang tidak memerlukan perkalian dan pembagian dalam proses perhitungannya didalam seluruh implementasi, yang mana aritmatika integer ini memiliki kecepatan perhitungan yang lebih tinggi daripada aritmatika floating point. Algoritma Bresenham memberikan persamaan umum untuk lingkaran sebagai berikut:

(X – a)2 + (Y – b)2 = R2

Dengan (Xa,Ya) sebagai koordinat awal dan (Zt,Yt) sebagai koordinator akhir. Persamaan umum lingkaran yang diberikan oleh Algoritma Bresenham di atas diturunkan dari persamaan umum lingkaran :

X2 + Y2 = R2

Keterangan:

X = absis ³ 0

Y = ordinat ³ 0

R = bilangan integer ³ 1.

Pada algoritma pembuatan lingkaran dengan arah penggambaran searah jarum arah jarum jam untuk lintasan yang besarnya seperempat lingkaran atau 90˚ memiliki tiga titik perhitungan yaitu m1, m2, dan m3.

Gambar 6. Flowchart Procedure

Bresenham

Fungsi procedure dibawah ini sebagai algoritma utama Bresenham untuk menggambar lingkaran.

begin

x:=0;

y:=100;

xCenter:=150;

yCenter:=150;

plotpoints;

p:=1-y;

while x <>

begin

if p<0>

x:=x+1

else

begin

x:=x+1;

y:=y-1;

end;

if p<0>

p:=p+2*x+1;

else

p:=p+2*(x-y)+1;

plotpoints

end;

Menggambar sebuah lingkaran dengan menggunakan delphi7

Tampilan

unit Unit1;

interface

uses

Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls, Forms,

Dialogs, StdCtrls, ExtCtrls;

type

TForm1 = class(TForm)

Panel1: TPanel;

Label1: TLabel;

Edit1: TEdit;

Button1: TButton;

CheckBox1: TCheckBox;

procedure Button1Click(Sender: TObject);

procedure FormMouseDown(Sender: TObject; Button: TMouseButton;

Shift: TShiftState; X, Y: Integer);

procedure FormMouseMove(Sender: TObject; Shift: TShiftState; X,

Y: Integer);

procedure FormMouseUp(Sender: TObject; Button: TMouseButton;

Shift: TShiftState; X, Y: Integer);

private

{ Private declarations }

findrawing:boolean;

fjari,xcenter, ycenter:integer;

procedure GambarLingkaran(r:integer);

procedure GambarTitik(xi, yi:integer);

public

{ Public declarations }

end;

var

Form1: TForm1;

implementation

{$R *.dfm}

procedure TForm1.GambarTitik(xi,yi:integer);

var

x,y:Integer;

begin

x:=xcenter+xi;

y:=ycenter-yi;

canvas.pixels[x,y]:=clBlack;

//Deklarasi untuk view all

if checkbox1.checked then

begin

x:=xcenter-xi;

y:=ycenter-yi;

canvas.pixels[x,y]:=clBlack;

x:=xcenter-xi;

y:=ycenter+yi;

canvas.pixels[x,y]:=clBlack;

x:=xcenter+xi;

y:=ycenter+yi;

canvas.pixels[x,y]:=clBlack;

end;

procedure TForm1.GambarLingkaran(r:integer);

var

d1, d2:Real;

xi, yi:integer;

mh, md, mv:integer;

begin

xi:=0;

yi:=R;

while yi > 0 do

begin

GambarTitik(xi, yi);

md:=abs(sqr(xi+1)+sqr(yi-1)-sqr(r));

mh:=abs(sqr(xi+1)+sqr(yi)-sqr(r));

mv:=abs(sqr(xi)+sqr(yi-1)-sqr(r));

d1:=sqr(xi+1)+sqr(yi-1)-sqr(r);

if d1<0>

begin

d2:=mh-md;

if d2<=0 then

begin

xi:=xi+1;

yi:=yi;

end

else

begin

xi:=xi+1;

yi:=yi-1;

end;

end

else if d1>0 then

begin

d2:=mv-md;

if d2<=0 then

begin

xi:=xi;

yi:=yi-1;

end

else

begin

xi:=xi+1;

yi:=yi-1;

end;

end

else if d1=0 then

begin

xi:=xi+1;

yi:=yi-1;

end;

procedure TForm1.Button1Click(Sender: TObject);

begin

TRY

Canvas.FillRect(Rect(0, Panel1.Height,Width,Height));

xcenter:=width div 2;

ycenter:=height div 2;

GambarLingkaran(strtoint(edit1.Text));

EXCEPT

ShowMessage('ISI!');

end;

procedure TForm1.FormMouseDown(Sender: TObject; Button: TMouseButton;

Shift: TShiftState; X, Y: Integer);

begin

xcenter:=x;

ycenter:=y;

findrawing:=true;

CheckBox1.Checked:=true;

//tentukan jari2 pertama sama dengan 10

fjari:=10;

//gunakan modus pen pmnotxor

Canvas.Pen.Mode:=pmNotXor;

//gambar lingkaran pertama

GambarLingkaran(fjari);

end;

procedure TForm1.FormMouseMove(Sender: TObject; Shift: TShiftState; X,

Y: Integer);

var

dx,dy:integer;

begin

if findrawing then

begin

//hapus lingkaran sebelumnya

GambarLingkaran(fjari);

//hitung jari2 yang baru

dx:=abs(xcenter-x);

dy:=abs(ycenter-y);

if dx>dy then fjari:=dx else fjari:=dy;

//gambar lingkaran yang baru

GambarLingkaran(fjari);

end;

procedure TForm1.FormMouseUp(Sender: TObject; Button: TMouseButton;

Shift: TShiftState; X, Y: Integer);

var

dx,dy:integer;

begin

//hapus lingkaran sebelumnya

GambarLingkaran(fjari);

//selesai menggambar

findrawing:=false;

//ubah modus ke pmcopy

Canvas.Pen.Mode:=pmCopy;

//hitung jari2 yang baru

dx:=abs(xcenter-x);

dy:=abs(ycenter-y);

if dx>dy then fjari:=dx else fjari:=dy;

//gambar lingkaran terakhir

GambarLingkaran(fjari);

end;

end.

Download Sample Program
Download Program Source