Line Dan Polygon Clipping
MATERI
• Viewing Transformation Pipeline in 2D
• Line and polygon clipping
• Brute force analytic solution
• Cohen-Sutherland Line Clipping Algorithm
• Liang-Barsky Algorithm
• Cyrus-Beck Line Clipping Algorithm
• Sutherland-Hodgman Polygon Clipping
• Sampling Theorem (Nyquist Frequency)
Viewing Transformation Pipeline in 2D
Viewing Transformation in 2D
• Obyek-obyek diberikan dalam koordinat world
• The world terlihat melalui window
• Window dipetakan kedalam sebuah device
viewport
Viewing Transformation in 2D
Line and Polygon Clipping
• Masalah: Mengingat satu set garis 2D atau
poligon dan jendela , klip garis atau poligon ke
daerah mereka yang berada di dalam jendela
Line and Polygon Clipping
• Efficiency
• Display in portion of a screen
Ketampakan Garis
(Line Visibility)
• Garis-garis yang tampak pada area gambar
atau viewing dapat dikelompokkan menjadi
tiga kelompok, yaitu:
1. Garis yang terlihat seluruhnya (Fully visible).
2. Garis yang hanya terlihat sebagian (Partiality
Visible).
3. Garis yang tidak terlihat sama sekali (Fully
Invisible).
Ketampakan Garis
(Line Visibility)
• Garis yang dipotong adalah garis yang
memiliki ketampakan sebagian (Partiality
Visible) dari daerah area gambar.
• Sedangkan garis yang memiliki ketampakan
seluruhnya.tidak perlu dipotong, dan garis
yang memiliki ketampakan tidak terlihat sama
sekali tidak perlu digambar.
Line Clipping
• Jendela dijelaskan dengan dua titik ekstrem
yaitu :
• Sebuah titik berada dalam window jika :
ALGORITMA BRUTE FORCE
• Jika kedua ujung garis berada didalam window,
jangan dipotong
• Untuk garis yang salah satu ujungnya diluar
window, hitung titik potongnya terhadap batas
window, kemudian lakukan pemotongan dari titik
potong ini ke arah luar
• Untuk garis yang kedua ujungnya terletak diluar
window, hitung titik potong terhadap batas
window kemudian potong dari titik tersebut
keluar.
ALGORITMA BRUTE FORCE
• Menghitung titik potong merupakan
komputasi yang tidak efisien, karena view bisa
berisi banyak sekali garis, karena itu
pendekatan ini untuk clipping sangat lambat
Cohen-Sutherland
• Cohen-Sutherland mengusulkan sebuah
metode untuk menentukan apakah sebuah
garis perlu dipotong atau tidak.
• Area gambar didefinisikan sebagai sebuah
area segiempat yang dibatasi oleh xMin,
xMax, yMin, yMax
Cohen-Sutherland
• Setiap ujung garis diberi kode 4 bit dan
disebut sebagai region code, region code
ditentukan berdasarkan area dimana ujung
garis tersebut berada.
Susunan Region Code
Cohen-Sutherland
• Dimana isi dari masing-masing bit ditentukan
berdasarkan pengujian
Cohen-Sutherland
• Region code dinyatakan dengan biner
memperlihatkan posisi dari titik terhadap
bidang clipping.
Cohen-Sutherland
Region Code
Arti
0000
Terletak di dalam viewport
0001
Terletak di sebelah kiri viewport
0010
Terletak di sebelah kanan viewport
0100
Terletak di sebelah bawah viewport
0101
Terletak di sebelah kiri bawah viewport
0110
Terletak di sebelah kanan bawah viewport
1000
Terletak di sebelah atas viewport
1001
Terletak di sebelah kiri atas viewport
1010
Terletak di sebelah kanan atas viewport
ALGORITMA CLIPING COHENSUTHERLAND
1.
2.
Tentukan region code dari setiap ujung garis
Jika kedua ujung garis memiliki region code 0000, maka garis
berada di dalam window clipping
3. Jika salah satu garis terletak didalam window, lakukan clipping
dengan cara berikut :
•
Tentukan titik potong garis dengan tepi window, kemudian
gambar garis antara ujung garis yang di dalam window dengan
titik potong
4. Jika kedua ujung garis tidak berada didalam window, lakukan operasi
logika AND untuk kedua region code
• Jika hasilnya tidak 0000, maka buang garis tersebut (invisible)
• Jika hasilnya 0000, cari titik potong antara garis dengan sisi-sisi
window, kemudian gambar garis antara dua titik potong tersebut
5. Ulangi langkah 2 untuk garis yang lain.
Cohen-Sutherland
• Jika diketahui area gambar ditentukan dengan
xMin = 1, yMin = 1 dan xMax = 4, yMax= 5 dan
dua buah garis:
• 1. P(-1,-2) – (5,6)
• 2. Q(-1,6) – (6,7)
• Maka tentukan region code dari masingmasing ujung garis tersebut
Cohen-Sutherland
• Jawab:
1. Garis P: Ujung garis P(-1, -2)
•
•
•
•
•
L = 1; karena x < xMin atau -1 < 1
R = 0; karena x < xMax atau -1 < 4
B = 1; karena y < yMin atau -2 < 1
T = 0; karena y < yMax atau -2 < 5
Dengan demikian region code untuk ujung P(1,-2) adalah 0101
Cohen-Sutherland
•
•
•
•
•
•
Ujung garis P(5,6).
L = 0; karena x > xMin atau 5 > 1
R = 1; karena x > xMax atau 5 > 4
B = 0; karena y > yMin atau 6 > 1
T = 1; karena y > yMax atau 6 > 5
Dengan demikian region code untuk ujung
P(5,6) adalah 1010, karena region code dari
kedua ujung garis tidak sama dengan 0000
maka garis P bersifat kemungkinan partialy
invisible dan perlu dipotong.
Cohen-Sutherland
2. Garis Q:
• Dengan cara yang sama pada garis P maka
akan ditentukan region code:
• Ujung garis Q(-1,6) mempunyai region code =
1001
• Ujung garis Q(6,7) mempunyai regian code =
1010
• Karena region code tidak sama dengan 0000
maka garis Q bersifat kemungkinan partialy
invisible dan perlu dipotong.
Cohen-Sutherland
• Menentukan Titik Potong
• Setelah garis ditentukan ketampakannya,
maka langkah berikutnya adalah menentukan
lokasi titik potong antara garis tersebut
dengan batas area gambar.
• Titik potong dihitung berdasarkan bit=1 dari
region code dengan menggunakan panduan
pada Tabel
Cohen-Sutherland
• Mencari titik potong
Cohen-Sutherland
• Dengan Xp1, Xp2, Yp1 dan Yp2 dihitung menggunakan persamaan
berikut:
Ymin – y1
• Xp1 = x1+ ---------------------M
Ymax – y1
• Xp2 = x1 + ---------------------M
• Yp1 = y1 + m * (xmin – x1)
• Yp2 = y1 + m * (xmax – x1)
• Dengan:
Y2 – Y1
• M = -------------X2 - X1
Cohen-Sutherland
• Bergantung kepada lokasi ujung garis maka
kita akan memperoleh 2, 3, atau 4 titik potong
• Kemungkinan banyaknya titik potong
Cohen-Sutherland
• Apabila ditemukan titik potong lebih dari dua pada
suatu ujung maka pilihlah titik potong yang ada di
dalam area gambar.
• Untuk contoh diatas titik potong pada garis P
adalah :
• Region Bit B = 1
• titik (1.25 , 1)
• Region Bit R = 1
• titik (4, 4.7)
Cohen-Sutherland
• Cara mencari titik potong sebagai berikut :
• Titik potong garis P (-1,-2) – (5,6)
y2 – y1
• m = -------x2 – x1
6 – (-2 )
= --------5 - (-1)
= 8/6
Cohen-Sutherland
• Region code 0101 di titik (-1,-2):
• L=1 yp1 = y1 + m * (xmin – x1)
= -2 + (8/6) * (1-(-1))
yp1 = 0,86
• Titik potongnya adalah (xmin,yp1) = (1, 0.66)
Ymin – y1
• B = 1 xp1 = x1 + --------------M
(1 – (-2))
• = -1 + --------------8/6
• xp1 = 1.26
• Titik potongnya adalah (xp1, ymin) = (1.26 , 1)
Cohen-Sutherland
• Region code 1010 di titik (5,6):
• R =1 yp2 = y1 + m * (xmax – x1)
= 6 + (8/6) * (4-5)
yp2 = 4.65
• Titik potongnya adalah(xmax, yp2) = (4, 4.65)
Ymax – y1
• T =1 xp2 = x1 + --------------------m
(5 – 6)
• = 5 + ---------------------8/6
• xp2 = 4.26
• Titik potongnya adalah (xp2, ymax) = (4.26 , 5)
• Ada titik potong pada garis P yaitu (1, 0.67) , (1.25 ,1 ) , (4 , 4.65) ,
(4.25 , 5). Pilih titik
• potong yang terdapat dalam viewport yaitu (1.26 , 1) dan (4 , 4.65)
Liang-Barsky
• Clipping yang lebih cepat dikembangkan
berdasarkan persamaan parametrik dari segmen
garis dapat ditulis dalam bentuk:
• x = x1 + u.dx
• y = y1 + u.dy
• Dimana dx = x2 – x1 dan dy = y2-y1.
• Dimana nilai uЄ[0,1].
• Menurut Liang dan Barsky bentuk
pertidaksamaan sebagai berikut:
• xwmin <= x1 + u.dx <= xwmax
• ywmin <= y1 + u.dy <= ywmax
Liang-Barsky
• Dengan
u.pk <= qk, k=1,2,3,4
• Dimana parameter p dan q ditentukan sebagai berikut:
k = 1 (Kiri): p1 = -dx, q1= x1-xwmin
k = 2 (Kanan): p2 = dx, q2= xwmax – x1
k = 3 (Bawah): p3 = -dy, q3= y1-ywmin
k = 4 (Atas): p4 = dy, q4= ywmax-y1
• Garis yang sejajar dengan salah satu batas clipping
mempunyai pk = 0 untuk nilai k=1,2,3,4 yaitu left, right,
bottom, dan top.
• Untuk setiap nilai k, juga diperoleh qk<0, maka garis
sepenuhnya diluar batas clipping.
• Bila qk>=0, maka garis didalam dan sejajar batas clipping.
Liang-Barsky
• Bila pk<0, garis memotong batas clipping dari luar ke
dalam, dan bila pk>0, garis memotong batas clipping dari
dalam ke luar.
• Untuk nilai pk yang tidak sama dengan 0, nilai u dapat
diperoleh dengan
• u = qk / pk
• Untuk setiap garis, dapat dihitung nilai dan parameter u1
dan u2 yang menentukan posisi garis dalam bidang
clipping.
• Nilai u1 diperlihatkan dengan batas clipping dimana garis
memotong batas clipping dari luar ke dalam (p<0).
• rk = qk / pk
Liang-Barsky
• Dengan nilai u1 adalah nilai maksimum dari nilai 0 dan
bermacam-macam nilai rk.
• Sebaliknya nilai u2 ditentukan dengan memeriksa batas
dimana clipping dipotong oleh garis dari dalam keluar
(p>0).
• Nilai rk dihitung untuk setiap batas clipping, dan nilai
u2 merupakan nilai minimum dari sekumpulan nilai
yang terdiri dari 1 dan nilai rk yang dihasilkan.
• Bila u1>u2, maka garis sepenuhnya berada di luar clip
window dan dapat dihilangkan .
• Bila u1<u2, maka dicari nilai endpoint yang baru
• Sebaliknya bila tidak endpoint dari garis yang di clip
dihitung dari dua nilai parameter u.
• Untuk (pi < 0) T1 = Max (rk)
• Untuk (pi > 0) T2 = Min (rk)
Liang-Barsky
• Jika T1 < T2 cari nilai endpoint yang baru.
u1 ( x1 + dx * t1 , y1 + dy * t1) titik awal garis
yang baru
u2 ( x1 + dx * t2 , y1 + dy * t2) titik ujung garis
yang baru
• Algoritma Liang-Barsky lebih efisien
dibandingkan dengan Cohen-Sutherland
karena perhitungan titik potong dihilangkan.
Soal
• Diketahui sebuah segmen garis melalui titik P
(-5,3) dan Q(15,9) dan persamaan tepi
window berukuran (0,0)-(10,10). Tentukan
hasil clipping nya.
CLIPPING POLIGON
(ALGORITMA SUTHERLAND-HODMAN)
• Clipping dilakukan terhadap tiap-tiap sisi
window
• Input berupa poligon yang terdiri dari urutan
vertex (titik-titik pembentuk poligon) : v1,
v2,...vn
• Output berupa kumpulan verteks pembentuk
poligon hasil proses clipping
CLIPPING POLIGON
(ALGORITMA SUTHERLAND-HODMAN
• Aturan pemotongan garis yang melewati titik T1
(x1,y1) dan T2 (x2,y2) adalah :
1. Jika T1 titik dalam dan T2 titik dalam, maka
output T1,T2
2. Jika T1 titik dalam dan T2 titik luar, maka output
T’2,T1
3. Jika T1 titik luar dan T2 titik dalam, maka output
T’1, T2
4. Jika T1 titik luar dan T2 titik luar, maka output :
Tidak Ada
TITIK POTONG GARIS
• Titik potong garis dengan sisi kiri window (x,y)
• 𝑥 = 𝑥𝑚𝑖𝑛
• 𝑦=
(𝑦2−𝑦1)
(𝑥2−𝑥1)
∗ 𝑥𝑚𝑖𝑛 − 𝑥1 + 𝑦1
• Titik potong garis dengan sisi atas window (x,y)
• 𝑥 = 𝑥1 +
• 𝑦 = 𝑦𝑚𝑎𝑥
(𝑥2−𝑥1)
(𝑦2−𝑦1)
∗ (𝑦𝑚𝑎𝑥 − 𝑦1)
TITIK POTONG GARIS (2)
• Titik potong garis dengan sisi kanan window (x,y)
• 𝑥 = 𝑥𝑚𝑎𝑥
• 𝑦=
(𝑦2−𝑦1)
(𝑥2−𝑥1)
∗ 𝑥𝑚𝑎𝑥 − 𝑥1 + 𝑦1
• Titik potong garis dengan sisi bawah window (x,y)
• 𝑥 = 𝑥1 +
• 𝑦 = 𝑦𝑚𝑖𝑛
(𝑥2−𝑥1)
(𝑦2−𝑦1)
∗ (𝑦𝑚𝑖𝑛 − 𝑦1)
CONTOH SOAL
• Lakukan clipping dengan algoritma
Sutherland-Hodgman dari sebuah polygon
(A,B,C,D,E,F,G) yang dibatasi oleh window segi
empat (-4,2)-(10,10) dibawah ini :
CONTOH SOAL (2)
• Clipping terhadap sisi kiri window
• Titik luar : A
• Titik A membentuk garis AB dan berpotongan
dengan sisi kiri window di T1.
• Titik potong garis AB dengan sisi kiri window :
T1(x,y)
• 𝑥 = 𝑥𝑚𝑖𝑛 = −4
(𝑦2−𝑦1)
(𝑥2−𝑥1)
• 𝑦=
∗ 𝑥𝑚𝑖𝑛 − 𝑥1 + 𝑦1 =
−4 − (−6) + 5 =7
• Titik potong T1 = (-4,7)
(14−5)
(3+6)
∗
CONTOH SOAL (3)
• Titik A membentuk garis AG dan berpotongan
dengan sisi kiri window di T2.
• Titik potong garis AG dengan sisi kiri window
T2(x,y)
• 𝑥 = 𝑥𝑚𝑖𝑛 = −4
• 𝑦=
(𝑦2−𝑦1)
(𝑥2−𝑥1)
∗ 𝑥𝑚𝑖𝑛 − 𝑥1 + 𝑦1 =
−4 + 2 + 5 =5
• Titik potong T1 = (-4,5)
(5−5)
(−2− −6 )
∗
CONTOH SOAL (4)
• Lanjutkan untuk clipping terhadap
sisi atas, sisi kanan dan sisi bawah
window
??????