Transcript (1) (2)

ALGORITHMA GARIS
Hieronimus Edhi Nugroho, M.Kom
Algorithma Garis

Masalah :

Pixel mana yang harus dipilih untuk menggambar
sebuah garis ?
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
2
ALGORITHMA GARIS


Algorithma garis adalah algorithma untuk
menentukan lokasi pixel yang paling dekat
dengan garis sebenarnya (actual line)
Ada tiga algorithma utama untuk
menggambar garis :



Line Equation
DDA Algorithm
Bresenham’s Algorithm
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
3
Kuadran Garis
Kuadran
Kriteria
Arah Garis
(x2,y2)
I
(x1 < x2) dan (y1 < y2)
(x1,y1)
(x2,y2)
II
(x1 > x2) dan (y1 < y2)
(x1,y1)
(x1,y1)
III
(x1 > x2) dan (y1 > y2)
(x2,y2)
(x1,y1)
IV
(x1 < x2) dan (y1 > y2)
(x2,y2)
Contoh
(1,1) – (4,5)
(-3,2) – (-1,4)
(4,2) – (3,4)
(-3,-3) – (-6,-1)
(6,-2) – (4,-5)
(9,5) – (1,2)
(3,9) – (6,2)
(-2,1) – (4,-5)
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
4
Kuadran Garis
8
7
(x1,y1)
6
5
B
4
3
2
1
8
7
(x2,y2)
A
6
5
4
3
D
(x2,y2)
(x2,y2)
2
(x2,y2)
C
1
(x1,y1)
0 1 2
(x1,y1)
3 4 5 6 7 8 9
(x1,y1)
0 1 2
3 4 5 6 7 8 9
Di kuadran mana garis A ? Di kuadran mana garis B ? Dapatkah garis A dan B
dinyatakan sebagai garis dengan kuadran yang sama ? Bagaimana caranya ?
Bagaimana halnya dengan garis C dan D ?
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
5
Kuadran Garis

Garis A : (3 ; 1) – (8 ; 4)


Garis A berada di kuadran I
Garis B : (3 ; 7) – (1 ; 2)




Garis B berada di kuadran III
m = (2 – 7) / (1 – 3) = -5 / -2 = 2.5
tetapi apabila garis B dinyatakan sebagai (1 ; 2) –
(3 ; 7) maka garis B akan berada di kuadran I
m = (7 – 2 ) / ( 3 – 1) = 5 / 2 = 2.5
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
6
LINE EQUATION

Sebuah garis lurus dapat diperoleh dengan
menggunakan rumus :
y = mx + b

dimana :


y2
m = gradien
b = perpotongan garis
dengan sumbu y.
y1
b
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
x1
x2
7
LINE EQUATION

Apabila dua pasang titik akhir dari sebuah
garis dinyatakan sebagai (x1,y1) and (x2,
y2), maka nilai dari gradien m dan lokasi b
dapat dihitung dengan :
y2  y1
(1)
m
x2  x1
b  y1  m  x1
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
(2)
8
Contoh

Gambar garis (0,1) – (5,7) dengan
menggunakan Line Equation
x1 =
x2 =
m =
b =
7
6
5
4
3
2
1
0
0 y1 = 1
5 y2 = 7
(7-1)/(5-0) = 1,2
1 – 1,2 * 0 = 1
x
0 1 2
3 4 5 6 7 8
y
0
1.2 * 0 + 1 = 1
1
1.2 * 1 + 1 = 2,2 ≈ 2
2
1.2 * 2 + 1 = 3,4 ≈ 3
3
1.2 * 3 + 1 = 4,6 ≈ 5
4
1.2 * 4 + 1 = 5,8 ≈ 6
5
1.2 * 5 + 1 = 7
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
9
Gradien dan Tipe Garis
y2
miring 45o
tegak
y2
mendatar
y1
y1
y1
x1
x1
m = tak terdefinisi
x1
x2
m=0
x2
m=1
y2
cenderung mendatar
cenderung tegak
y2
y1
y1
x1
0<m<1
x2
x1
x2
m>1
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
10
Tipe Garis
8
7
6
5
B
4
3
A
2
1
0 1 2
3 4 5 6 7 8 9
Dapatkah anda mencari perbedaan yang esensial
antara garis A dan B (misal : gradien, pertambahan x dan y) ?
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
11
Tipe Garis

Garis A : (3;1) – ( 8;4)




Garis B : (1;2) – (2;7)




m = (y2 – y1) / (x2 – x1) = (4-1)/ (8-3) = 3/5= 0,6
0<m<1
xi+1 = xi + 1 ; yi+1 = yi + d1
m = (7-2) / (2-1) = 5 / 1 = 5
m>1
xi+1 = xi + d2 ; yi+1 = yi + 1
Berapa nilai d1 dan d2 ?
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
12
ALGORITHMA DDA


Digital differential analyzer (DDA) merupakan
algorithma untuk menghitung posisi pixel
disepanjang garis dengan menggunakan
posisi pixel sebelumnya.
Algorithma berikut ini menggunakan asumsi
bahwa garis berada di kuadran I atau II serta
garis bertipe cenderung tegak atau
cenderung mendatar.
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
13
Algorithma DDA

Untuk garis dengan 0 < m < 1, maka xi+1 = xi
+1 dan :
yi 1  yi  m

(3)
Untuk garis dengan m > 1, maka yi+1 = yi + 1
dan :
1
xi 1  xi 
m
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
(4)
14
Algorithma DDA

Garis dengan 0 > m > -1, maka xi+1 = xi-1 dan
yi 1  yi  m

(5)
Sedangkan bila m < -1, maka yi+1 = yi+1 dan
1
xi 1  xi 
m
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
(6)
15
Contoh Algorithma DDA

Gambar garis dari (0;1) – (5;7) dengan
menggunakan DDA.
x1=0,y1=1
x2=5,y2=7
m = (7-1)/(5-0) = 1,20
1/m=1/1,20 = 0,83
7
6
5
4
3
2
1
0
x
0 1 2
y
0
1
0+0,83 = 0,83 ≈ 1
2
0,83+0,83 = 1,66 ≈ 2
3
1,66+0,83 = 2,59 ≈ 3
4
2,59+0,83 = 3,42 ≈ 3
5
3,42+0,83 = 4,25 ≈ 4
6
4,25+0,83 = 5,08 ≈ 5
7
3 4 5 6 7 8
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
16
Algorithma Bresenham



Bresenham mengembangkan algorithma yang
lebih efisien.
Algorithma ini mencari nilai integer yang paling
mendekati garis sesungguhnya (actual line).
Algorithma ini tidak memerlukan pembagian.
3
2
1
0
actual line
0 1 2
3 4
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
17
Algorithma Bresenham


Algorithma Bresenham yang disajikan berikut
ini hanya dapat digunakan untuk garis yang
berada di kuadran I dan 0 < m < 1.
Anda yang ingin mempelajari pembuktian
matematis dari algorithma Bresenham
silahkan membaca buku Computer Graphics
(Hearn dan Baker)
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
18
Algorithma Bresenham
Xi+1,yi+
1
Actual line
xi,yi
Xi+1,yi
d1
d1=m – ½, karena d1< 0 atau negatif maka pixel berikutnya adalah
pixel (xi+1, yi)
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
19
Algorithma Bresenham
Xi+1,yi+
Actual line
1
d1
Xi+1,yi
xi,yi
d1=m – ½, karena d1> 0 atau positif maka pixel berikutnya adalah
pixel (xi+1, yi+1)
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
20
Algorithma Bresenham (0 < m < 1)
dx = x2 – x1 ;dy = y2 – y1
d1 =2 * dy ; d2 =2 * (dx – dy)
p = d1 – dx
x = x1 ; y = y1
p = p + d1
y=y
T
p >= 0
Y
p = p - d2
y = y +1
x = x +1
stop
Y
x >= x2
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
21
Algorithma Bresenham

Gambar garis berikut ini dengan
menggunakan algorithma Bresenham :
(0;1) – (6;5)
(2;2) – (7;5)
(0;1) – (5;7)
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
22
Algorithma Bresenham
Garis : (0;1) - (6;5)
8
7
6
5
4
3
2
1
0
0 1
p
x
y
2
0
1
-2
1
2
6
2
2
2
3
3
-2
4
4
6
5
4
2
6
5
2 3 4 5 6 7 8 9 10
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
23
Algorithma Bresenham
Garis : (2;2) - (7;5)
8
7
6
5
4
3
2
1
0
p
x
y
1
2
2
-3
3
3
3
4
3
-1
5
4
5
6
4
1
7
5
0 1 2 3 4 5 6 7 8 9 10
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
24
Algorithma Bresenham
Garis : (0;1) - (5;7)
8
7
6
5
4
3
2
1
0
0 1
p
x
y
7
0
1
9
1
2
11
2
3
13
3
4
15
4
5
17
5
6
2 3 4 5 6 7 8 9 10
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
25
Algorithma Bresenham

Mengapa garis (0;1) – (5;7) tidak dapat
digambar dengan tepat ?

Garis (0;1) – (5;7) mempunyai m = 1,2, dengan
demikian asumsi pada algorithma tersebut tidak
tepat dan harus disesuaikan.
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
26
Algorithma Bresenham ( m > 1)
dx = x2 – x1 ; dy = y2 – y1
d1 =2 * dx ; d2 =2 * (dx – dy)
p = d1 – dy
x = x1 ; y = y1
p = p + d1
x=x
T
p >= 0
Y
p = p + d2
x = x +1
y = y +1
stop
y >= y2
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
27
Algorithma Bresenham (m > 1)
Garis : (0;1) - (5;7)
8
7
6
5
4
3
2
1
0
0 1
p
x
y
4
0
1
2
1
2
0
2
3
-2
3
4
8
3
5
6
4
6
4
5
7
2 3 4 5 6 7 8 9 10
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
28
SOAL

Gunakan algorithma DDA dan Bresenham
untuk menggambar garis-garis berikut :
1.
2.
3.
4.
5.
(2;1) – (9;6)
(1;2) – (8;5)
(3;1) – (10;5)
(6;7) – (13;10)
(2;8) – (9;11)
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
29
Atribut Garis

Atribut garis meliputi :

Ketebalan garis

Pola garis

Warna garis
H. Edhi Nugroho - Grafika Komputer - Algorithma Garis
30