[PPT] - P l Polygon Filling Filli Werner Purgathofer Werner Purgathofer PowerPoint Presentation

SLIDE 1

Einführung in Visual Computing g p g

186.822

P l Filli Polygon Filling

Werner Purgathofer Werner Purgathofer

SLIDE 2

Linked Lists

fl ibl d flexible data structure

…

x1 x2

data pointer (link to next element) (link to next element) list list^ list^.next^

…

x1 x2

…

x1 x2

…

x1 x2

list^.next list^.next^.next

Werner Purgathofer / Einf. in Visual Computing 2

SLIDE 3

Linked Lists: Removal of First Element

1 2 3 4 5 list 1 2 3 4 5

list = list^.next

Werner Purgathofer / Einf. in Visual Computing 3

SLIDE 4

Linked Lists: Inserting New First Element g

1 2 3 4 5 list 1 2 3 4 5 new

new^.next = list

Werner Purgathofer / Einf. in Visual Computing 4

SLIDE 5

Linked Lists: Inserting New 1st Element g

1 2 3 4 5 list 1 2 3 4 5 new new^.next = list list = new

Werner Purgathofer / Einf. in Visual Computing 5

SLIDE 6

Linked Lists: Exchanging Elements 2 & 4 g g

last1 last2 help list 1 2 3 4 5 list

help = last1^ next^ next help = last1 .next .next

Werner Purgathofer / Einf. in Visual Computing 6

SLIDE 7

Linked Lists: Exchanging Elements 2 & 4 g g

last1 last2 help list 1 2 3 4 5 list

help = last1^ next^ next help = last1 .next .next last1^.next^.next = last2^.next^.next

Werner Purgathofer / Einf. in Visual Computing 7

SLIDE 8

Linked Lists: Exchanging Elements 2 & 4 g g

last1 last2 help list 1 2 3 4 5 list

help = last1^ next^ next help = last1 .next .next last1^.next^.next = last2^.next^.next last2^.next^.next = help

Werner Purgathofer / Einf. in Visual Computing 8

SLIDE 9

Linked Lists: Exchanging Elements 2 & 4 g g

last1 last2 help list 1 2 3 4 5 list

help = last1^ next^ next help = last1 .next .next last1^.next^.next = last2^.next^.next last2^.next^.next = help help = last1^.next

Werner Purgathofer / Einf. in Visual Computing 9

SLIDE 10

Linked Lists: Exchanging Elements 2 & 4 g g

last1 last2 help list 1 2 3 4 5 list

help = last1^ next^ next help = last1 .next .next last1^.next^.next = last2^.next^.next ast . e t . e t ast . e t . e t last2^.next^.next = help help = last1^.next l 1^ l 2^ last1^.next = last2^.next

Werner Purgathofer / Einf. in Visual Computing 10

SLIDE 11

Linked Lists: Exchanging Elements 2 & 4 g g

last1 last2 help list 1 2 3 4 5 list

help = last1^ next^ next help = last1 .next .next last1^.next^.next = last2^.next^.next ast . e t . e t ast . e t . e t last2^.next^.next = help help = last1^.next l 1^ l 2^ last1^.next = last2^.next last2^ next = help

Werner Purgathofer / Einf. in Visual Computing 11

last2 .next = help

SLIDE 12

Repetition: What is Inside a Polygon? p yg

dd-even rule

nonzero-winding- number rule ???

dd even rule

nonzero winding number rule ???

Werner Purgathofer / Einf. in Visual Computing 12

SLIDE 13

Inside‐Outside Tests

filli l i h area‐filling algorithms

“interior” “exterior” for self intersecting polygons? “interior”, “exterior” for self‐intersecting polygons?

dd‐even rule
dd even rule

nonzero‐winding‐number rule g same result for simple polygons

Werner Purgathofer / Einf. in Visual Computing 13

SLIDE 14

What is Inside?: Odd‐Even Rule

i id / id i h d inside/outside switches at every edge t i ht li t th t id straight line to the outside:

even # edge intersections = outside even # edge intersections = outside

dd # edge intersections = inside
dd # edge intersections inside

2 3 4 1 2 1 2 1 2 3 4 1 2 1

Werner Purgathofer / Einf. in Visual Computing 14

2 3

SLIDE 15

What is Inside?: Nonzero Winding Number

i i i id if l d i

g

point is inside if polygon surrounds it t i ht li t th t id straight line to the outside:

same # edges up and down = outside same # edges up and down = outside different # edges up and down = inside different # edges up and down inside

Werner Purgathofer / Einf. in Visual Computing 15

SLIDE 16

Fill‐Area Primitives

for polygon area (solid color patterned) for polygon area (solid‐color, patterned)

scan‐line polygon fill algorithm sca e po ygo a go intersection points located and sorted consecutive pairs define interior span attention with vertex intersections attention with vertex intersections exploit coherence (incremental calculations) exploit coherence (incremental calculations) flood fill algorithm

Werner Purgathofer / Einf. in Visual Computing 16

SLIDE 17

Scan‐Line Fill: Sorted Edge Table g

E D E yE xD 1/mDE B D B C yB xC 1/mCB yD xC 1/mCD C F y x

1/m

F yF xA 1/mAF yB xA 1/mAB yE xF 1/mFE

Th t d d t bl t i ll l d

A yF xA 1/mAF yB xA 1/mAB

The sorted edge table contains all polygon edges sorted by lowest y value sorted by lowest y-value

y x t

t 1/m

Werner Purgathofer / Einf. in Visual Computing 17

ymax xstart 1/m

SLIDE 18

Scan‐Line Fill: Sorted Edge Table

t ll d b ll t l

g

sort all edges by smallest y‐value edge entry: edge entry: [max y‐value, x‐intercept, inverse slope] [ y p p ]

yB xC 1/mCB yD xC 1/mCD yB xC 1/mCB yD xC 1/mCD

active‐edge list

for each scan line for each scan line contains all edges crossed by that scan line contains all edges crossed by that scan line incremental update

consecutive intersection pairs (spans) filled

Werner Purgathofer / Einf. in Visual Computing 18

SLIDE 19

Sorted Edge Table

E D E yE xD 1/mDE B D B C yB xC 1/mCB yD xC 1/mCD C F y x

1/m

F yF xA 1/mAF yB xA 1/mAB yE xF 1/mFE

Th t d d t bl t i ll l d

A yF xA 1/mAF yB xA 1/mAB

The sorted edge table contains all polygon edges sorted by lowest y value sorted by lowest y-value

y x t

t 1/m

Werner Purgathofer / Einf. in Visual Computing 19

ymax xstart 1/m

SLIDE 20

Sorted Edge Table / Active Edge List

E D E yE xD 1/mDE B D B C yB xC 1/mCB yD xC 1/mCD C F y x

1/m

F yF xA 1/mAF yB xA 1/mAB yE xF 1/mFE A yF xA 1/mAF yB xA 1/mAB

Active Edge List When processing from bottom to t k li t f ll ti d top, keep a list of all active edges

Werner Purgathofer / Einf. in Visual Computing 20

SLIDE 21

Sorted Edge Table / Active Edge List

E D E yE xD 1/mDE B D B C yB xC 1/mCB yD xC 1/mCD C F y x

1/m

F yF xA 1/mAF yB xA 1/mAB yE xF 1/mFE A yF xA 1/mAF yB xA 1/mAB

Active Edge List incremental update!

yF xA 1/mAF yB xA 1/mAB

Werner Purgathofer / Einf. in Visual Computing 21

SLIDE 22

Sorted Edge Table / Active Edge List

E D E yE xD 1/mDE B D B C yB xC 1/mCB yD xC 1/mCD C F y x

1/m

F yF xA 1/mAF yB xA 1/mAB yE xF 1/mFE A yF xA 1/mAF yB xA 1/mAB

Active Edge List

yF xA 1/mAF yB xA 1/mAB

Werner Purgathofer / Einf. in Visual Computing 22

SLIDE 23

Sorted Edge Table / Active Edge List

E D E yE xD 1/mDE B D B C yB xC 1/mCB yD xC 1/mCD C F y x

1/m

F yF xA 1/mAF yB xA 1/mAB yE xF 1/mFE A yF xA 1/mAF yB xA 1/mAB

Active Edge List

yE xF 1/mFE yB xA 1/mAB

Werner Purgathofer / Einf. in Visual Computing 23

SLIDE 24

Sorted Edge Table / Active Edge List

E D E yE xD 1/mDE B D B C yB xC 1/mCB yD xC 1/mCD C F y x

1/m

F yF xA 1/mAF yB xA 1/mAB yE xF 1/mFE A yF xA 1/mAF yB xA 1/mAB

Active Edge List

yE xF 1/mFE yB xA 1/mAB

Werner Purgathofer / Einf. in Visual Computing 24

SLIDE 25

Sorted Edge Table / Active Edge List

E D E yE xD 1/mDE B D B C yB xC 1/mCB yD xC 1/mCD C F y x

1/m

F yF xA 1/mAF yB xA 1/mAB yE xF 1/mFE A yF xA 1/mAF yB xA 1/mAB

Active Edge List

yE xF 1/mFE yB xA 1/mAB

Werner Purgathofer / Einf. in Visual Computing 25

SLIDE 26

Sorted Edge Table / Active Edge List

E D E yE xD 1/mDE B D B C yB xC 1/mCB yD xC 1/mCD C F y x

1/m

F yF xA 1/mAF yB xA 1/mAB yE xF 1/mFE A yF xA 1/mAF yB xA 1/mAB

Active Edge List

yE xF 1/mFE yB xA 1/mAB yB xC 1/mCB yD xC 1/mCD

Werner Purgathofer / Einf. in Visual Computing 26

SLIDE 27

Sorted Edge Table / Active Edge List

E D E yE xD 1/mDE B D B C yB xC 1/mCB yD xC 1/mCD C F y x

1/m

F yF xA 1/mAF yB xA 1/mAB yE xF 1/mFE A yF xA 1/mAF yB xA 1/mAB

Active Edge List

yE xF 1/mFE yB xA 1/mAB yB xC 1/mCB yD xC 1/mCD

Werner Purgathofer / Einf. in Visual Computing 27

SLIDE 28

Sorted Edge Table / Active Edge List

E D E yE xD 1/mDE B D B C yB xC 1/mCB yD xC 1/mCD C F y x

1/m

F yF xA 1/mAF yB xA 1/mAB yE xF 1/mFE A yF xA 1/mAF yB xA 1/mAB

Active Edge List

yE xF 1/mFE yD xC 1/mCD

Werner Purgathofer / Einf. in Visual Computing 28

SLIDE 29

Sorted Edge Table / Active Edge List

E D E yE xD 1/mDE B D B C yB xC 1/mCB yD xC 1/mCD C F y x

1/m

F yF xA 1/mAF yB xA 1/mAB yE xF 1/mFE A yF xA 1/mAF yB xA 1/mAB

Active Edge List

yE xF 1/mFE yD xC 1/mCD

Werner Purgathofer / Einf. in Visual Computing 29

SLIDE 30

Sorted Edge Table / Active Edge List

E D E yE xD 1/mDE B D B C yB xC 1/mCB yD xC 1/mCD C F y x

1/m

F yF xA 1/mAF yB xA 1/mAB yE xF 1/mFE A yF xA 1/mAF yB xA 1/mAB

Active Edge List

yE xF 1/mFE yE xD 1/mDE

Werner Purgathofer / Einf. in Visual Computing 30

SLIDE 31

Sorted Edge Table / Active Edge List

E D E yE xD 1/mDE B D B C yB xC 1/mCB yD xC 1/mCD C F y x

1/m

F yF xA 1/mAF yB xA 1/mAB yE xF 1/mFE A yF xA 1/mAF yB xA 1/mAB

Active Edge List

yE xF 1/mFE yE xD 1/mDE

Werner Purgathofer / Einf. in Visual Computing 31

SLIDE 32

Sorted Edge Table / Active Edge List

E D E yE xD 1/mDE B D B C yB xC 1/mCB yD xC 1/mCD C F y x

1/m

F yF xA 1/mAF yB xA 1/mAB yE xF 1/mFE A yF xA 1/mAF yB xA 1/mAB

Active Edge List

Werner Purgathofer / Einf. in Visual Computing 32

SLIDE 33

Scan‐Line Fill: Incremental Update

incremental update of intersection point

p

incremental update of intersection point slope of polygon boundary line: m slope of polygon boundary line: m

1   x x 1   1

1

 

 k k

y y m x x

k k 1

 



(for 2 successive scanlines) yk +1 (xk+1, yk+1) yk (xk, yk)

Werner Purgathofer / Einf. in Visual Computing 33

SLIDE 34

Scan‐Line Fill: Intersecting Vertices g

2

intersection points along

1 2

points along scan lines that

1 2

scan lines that intersect polygon

1 2

vertices

2

→ either special handling (1 or 2 intersecons?) → either special handling (1 or 2 intersecons?) → or move verces up or down by ε

Werner Purgathofer / Einf. in Visual Computing 34

SLIDE 35

Flood‐Fill Algorithm

i l filli f

g

pixel filling of area

areas with no single color boundary areas with no single color boundary start from interior point start from interior point “flood” internal region g 4‐connected, 8‐connected areas reduce stack size by eliminating several recursive calls

Werner Purgathofer / Einf. in Visual Computing 35

SLIDE 36

Flood‐Fill: Boundary and Seed Point

area must be distinguishable

y

area must be distinguishable from boundaries from boundaries seed point seed point example: area defined p within multiple color b d i boundaries

Werner Purgathofer / Einf. in Visual Computing 36

SLIDE 37

Flood‐Fill: Connectedness

Definition: Definition: 4-connected means, that a ti i l lid i 8-connected means, that a ti i lid i th 8 connection is only valid in these 4 directions connection is valid in these 8 directions these 4 directions directions

Werner Purgathofer / Einf. in Visual Computing 37

SLIDE 38

Examples for 4‐ and 8‐connected p

an 8-connected area a 4-connected area has an 8-connected border has a 4-connected border

Werner Purgathofer / Einf. in Visual Computing 38

SLIDE 39

Simple Flood‐Fill Algorithm p g

void floodFill4 (int x int y int new int old) void floodFill4 (int x, int y, int new, int old) { int color; { /* set current color to new */ tPi l ( l ) getPixel (x, y, color); if (color = old) { if (color = old) { setPixel (x, y); setPixel (x, y); floodFill4 (x–1, y, new, old); /* left */ floodFill4 (x, y+1, new, old); /* up */ fl dFill4 ( +1 ld) /* i ht */ floodFill4 (x+1, y, new, old); /* right */ floodFill4 (x y–1 new old) /* down */ floodFill4 (x, y 1, new, old) / down / }}

Werner Purgathofer / Einf. in Visual Computing 39

}}

SLIDE 40

Bad Behavior of Simple Flood‐Fill p

2 1 4 3 4 recursion recursion sequence q

Werner Purgathofer / Einf. in Visual Computing 40

SLIDE 41

Span Flood‐Fill Algorithm p g

floodFill4 produces too high stacks (recursion!) solution:

incremental horizontal fill (left to right) ( ) recursive vertical fill (first up then down)

Werner Purgathofer / Einf. in Visual Computing 41

SLIDE 42

Good Behavior of Span Flood‐Fill p

1 2 recursion recursion sequence q

Werner Purgathofer / Einf. in Visual Computing 42

SLIDE 43

Span Flood‐Fill Example p p

Stack: x

Werner Purgathofer / Einf. in Visual Computing 43

SLIDE 44

Span Flood‐Fill Example p p

Stack: x A B A B B 1 2 3 A 1 2 3 A

Werner Purgathofer / Einf. in Visual Computing 44

SLIDE 45

Span Flood‐Fill Example p p

Stack: A B F E B C F E 4 5 6 7 8 9 10 11 1 2 3 D C D 4 5 6 7 8 9 10 11 A 1 2 3 E F C D A F

Werner Purgathofer / Einf. in Visual Computing 45

SLIDE 46

Span Flood‐Fill Example p p

Stack: A G A C G E 12 13 14 C D E 4 5 6 7 8 9 10 11 12 13 14 1 2 3 E C D 4 5 6 7 8 9 10 11 A 1 2 3 F G C D A G

Werner Purgathofer / Einf. in Visual Computing 46

SLIDE 47

Span Flood‐Fill Example p p

Stack: A 15 16 17 18 A C E H 12 13 14 15 16 17 18 C D E=H 4 5 6 7 8 9 10 11 12 13 14 1 2 3 E C D 4 5 6 7 8 9 10 11 A 1 2 3 G H C D A H

Werner Purgathofer / Einf. in Visual Computing 47

SLIDE 48

Span Flood‐Fill Example p p

Stack: A 15 16 17 18 A C 12 13 14 15 16 17 18 19 (E) C D 4 5 6 7 8 9 10 11 12 13 14 19 (E) 1 2 3 E C D 4 5 6 7 8 9 10 11 A 1 2 3 H C D A

Werner Purgathofer / Einf. in Visual Computing 48

SLIDE 49

Span Flood‐Fill Example p p

Stack: A 15 16 17 18 A C 12 13 14 15 16 17 18 19 C D 4 5 6 7 8 9 10 11 12 13 14 19 J 1 2 3 I C 4 5 6 7 8 9 10 11 J 20 21 22 A 1 2 3 J C I 20 21 22 A I

Werner Purgathofer / Einf. in Visual Computing 49

SLIDE 50

Span Flood‐Fill Example p p

Stack: A 15 16 17 18 A C 12 13 14 15 16 17 18 19 C I 4 5 6 7 8 9 10 11 12 13 14 19 23 1 2 3 J C 4 5 6 7 8 9 10 11 20 21 22 23 A 1 2 3 C I 20 21 22 A I

Werner Purgathofer / Einf. in Visual Computing 50

SLIDE 51

Span Flood‐Fill Example p p

Stack: A 15 16 17 18 A C 12 13 14 15 16 17 18 19 C I 4 5 6 7 8 9 10 11 12 13 14 19 23 1 2 3 K C 4 5 6 7 8 9 10 11 20 21 22 23 A 1 2 3 C 20 21 22 24 25 A

K

24 25

K

Werner Purgathofer / Einf. in Visual Computing 51

SLIDE 52

Span Flood‐Fill Example p p

Stack: A 15 16 17 18 A C 12 13 14 15 16 17 18 19 C K 4 5 6 7 8 9 10 11 12 13 14 19 23 1 2 3 L C 4 5 6 7 8 9 10 11 20 21 22 23 A=N 1 2 3 M N C 20 21 22 24 25 A=N N 24 25 26 27 28 29 30 M 26 27 28 29 30 L

Werner Purgathofer / Einf. in Visual Computing 52

SLIDE 53

Span Flood‐Fill Example p p

Stack: A 15 16 17 18 A C 12 13 14 15 16 17 18 19 C L 4 5 6 7 8 9 10 11 12 13 14 19 23 1 2 3 M C 4 5 6 7 8 9 10 11 20 21 22 23 (A) 1 2 3 N C 20 21 22 24 25 31 32 33 24 25 26 27 28 29 30 31 32 33 M 26 27 28 29 30 L

Werner Purgathofer / Einf. in Visual Computing 53

SLIDE 54

Span Flood‐Fill Example p p

Stack: C 15 16 17 18 C L 12 13 14 15 16 17 18 19 L M 4 5 6 7 8 9 10 11 12 13 14 19 23 1 2 3 C 4 5 6 7 8 9 10 11 20 21 22 23 1 2 3 C 20 21 22 24 25 31 32 33 24 25 26 27 28 29 30 31 32 33 26 27 28 29 30 L 34 35 35

Werner Purgathofer / Einf. in Visual Computing 54

SLIDE 55

Span Flood‐Fill Example p p

Stack: C 15 16 17 18 C L 12 13 14 15 16 17 18 19 L 4 5 6 7 8 9 10 11 12 13 14 19 23 1 2 3 C 4 5 6 7 8 9 10 11 20 21 22 23 1 2 3 C 20 21 22 24 25 31 32 33 24 25 26 27 28 29 30 31 32 33 26 27 28 29 30 34 35 36 37 35 3

Werner Purgathofer / Einf. in Visual Computing 55

SLIDE 56

Span Flood‐Fill Example p p

Stack: C 15 16 17 18 C 12 13 14 15 16 17 18 19 4 5 6 7 8 9 10 11 12 13 14 19 23 1 2 3 4 5 6 7 8 9 10 11 20 21 22 23 38 1 2 3 20 21 22 24 25 31 32 33 38 24 25 26 27 28 29 30 31 32 33 finished! 26 27 28 29 30 34 35 36 37 finished! 35 3

Werner Purgathofer / Einf. in Visual Computing 56