Μαθηματικοί ΥπολογισμοίΜαθηματικοί ΥπολογισμοίΧειμερινό Εξάμηνο 2002-2003

55η Διάλεξηη Διάλεξη

ΟθόνεςΟθόνες γραφικών που γραφικών που βασίζονται σε εικονίδια βασίζονται σε εικονίδια

((pixels)pixels)

http://www.math.uoc.gr/~mav/my

24 Οκτώβρη 2002

Μα

θη

μα

τικ

οί

Υπολογισ

μοί

2

Περιεχόμενα

Φωτοσκίαση καμπυλών σαν εικονίδια Δυο Φωτοσκιάσεις ενός Ευθύγραμμου Τμήματος Γενικές Στρατηγικές Φωτοσκίασης Καμπυλών Φωτοσκίαση Ευθύγραμμου Τμήματος (1) Υπολογισμοί Διαφόρισης Καμπυλών Φωτοσκίαση Ευθύγραμμου Τμήματος (2)-(6)

Σταδιακές βελτιώσεις σε 5 βήματα Φωτοσκίαση Κύκλου

1η Υλοποίηση 2η Υλοποίηση Αποτελέσματα

Μα

θη

μα

τικ

οί

Υπολογισ

μοί

3

ΕισαγωγήΗ οθόνη των υπολογιστών συνήθως αποτελείται από ένα

ορθογώνιο πλέγμα (πχ. 600x900) τετραγωνικών εικονιδίων.

Κάθε εικονίδιο επιδεικνύει ένα συγκεκριμένο χρώμα. Η επίδειξη αυτή γίνετε με διάφορους τρόπους:

Άσπρο-μαύρη: Κάθε εικονίδιο έχει δυο μόνον πιθανές τιμές – μαύρο ή άσπρο.

Κλίμακα του γκρι: Κάθε εικονίδιο μπορεί να είναι μια απόχρωση του γκρι (πχ. 256 αποχρώσεις μεταξύ άσπρου και μαύρου).

Απεικονίσεις χρωματισμού: Κάθε εικονίδιο μπορεί να είναι ένα χρώμα που ανήκει σε ένα προκαθορισμένο σύνολο πεπερασμένου πληθικού αριθμού (πχ. από 256 διαφορετικά χρώματα).

Πλήρες χρωματισμός: Κάθε εικονίδιο μπορεί να είναι ένα χρώμα που ανήκει σε ένα ευρύ πεδίο χρωμάτων (πχ. Αυτό που καθορίζετε με την χρήση 8 bits για το κόκκινο, το πράσινο και το μπλε).

Μα

θη

μα

τικ

οί

Υπολογισ

μοί

4

Φωτοσκίαση καμπυλών σαν εικονίδια

Όταν επιδεικνύουμε μια καμπύλη σε συσκευή βασισμένη σε εικονίδια, πρέπει να χρωματίσουμε ένα σύνολο εικονιδίων το οποίο θα αποτελέσει μια προσέγγιση της καμπύλης.

Για παράδειγμα:

Η φωτοσκίαση αυτή υποθέτει ότι κάθε εικονίδιο μπορεί να πάρει μόνον δύο χρώματα. Μια καλλίτερη επιλογή είναι να χρησιμοποιήσουμε ενδιάμεσα σχήματα, εάν μπορεί φυσικά να τα επιδείξει η συσκευή, αλλά δεν θα ασχοληθούμε με το πως μπορεί να γίνει αυτό.

Μα

θη

μα

τικ

οί

Υπολογισ

μοί

5

Δυο Φωτοσκιάσεις ενός Ευθύγραμμου Τμήματος

Μια που φωτοσκιάζει κάθε εικονίδιο που τέμνει η γραμμή:

Μια που φωτοσκιάζει ακριβώς ένα εικονίδιο σε κάθε στήλη:

Είναι η μία καλλίτερη από την άλλη;

Μα

θη

μα

τικ

οί

Υπολογισ

μοί

6

Γενικές Στρατηγικές Φωτοσκίασης Καμπυλών

Υποθέστε ότι έχουμε την παραμετρική παράσταση μιας καμπύλης, σαν (x(t), y(t)), για t μέσα σε κάποιο πεδίο. Πώς μπορούμε να την φωτοσκιάσουμε;

Πρώτη Στρατηγική: Για έναν αρκετά μεγάλο αριθμό τιμών του t στο πεδίο τιμών του: Υπολόγισε τα x(t) και y(t). Στρογγύλευσε τις τιμές αυτές στο πλησιέστερο εικονίδιο. Θέσε στο εικονίδιο το επιθυμητό χρώμα.

Δεύτερη Στρατηγική : Για τιμές του t σε μια περιοχή του πεδίου τιμών του: Καθόρισε την κλίση της καμπύλης, και προχώρησε κατά ένα εικονίδιο κατά μήκος του άξονα που

είναι πλησιέστερος στην κλίση αυτή, Θέσε στο εικονίδιο το επιθυμητό χρώμα.

Μα

θη

μα

τικ

οί

Υπολογισ

μοί

7

Φωτοσκίαση Ευθύγραμμου Τμήματος (1)Θα γράψουμε ένα αποδοτικό πρόγραμμα φωτοσκίασης ευθύγραμμων

τμημάτων.Θα ακολουθήσουμε την δεύτερη στρατηγική, και θα υποθέσουμε ότι η

γραμμή αρχίσει από το (0,0) και έχει κλίση μεταξύ 0 και 1. Μπορούμε να μετασχηματίσουμε άλλες περιπτώσεις στην παραπάνω.

Υποθέτουμε επίσης ότι τα άκρα είναι ακέραιοι. Περιμένουμε αυτό να μας δημιουργήσει προβλήματα;proc DrawLine (x, y : int; c : colour)

var yt, m : real var yi : int m := y / x for xi : 0..x

yt := m * xi yi := floor (yt + 1/2) PutPixel (xi, yi, c)

end for end DrawLine

Η παραπάνω μέθοδος δεν είναι αρκετά αποδοτική.

Μα

θη

μα

τικ

οί

Υπολογισ

μοί

8

Υπολογισμοί Διαφόρισης Καμπυλών

Έστω ότι χρειαζόμαστε να υπολογίσουμε τα x(t) και y(t) πολλές τιμές του t: t = t0 ; t0 + δ, t0 + 2δ , ...

Αντί να υπολογίσουμε το x(t) ξεχωριστά για κάθε t, μπορούμε να υπολογίσουμε το we can evaluate x(t0) = x 0, και μετά να υπολογίσουμε τα

xi+1 = x(ti+1) = xi + δ dx/dt (ti) Ο παραπάνω τρόπος θα είναι πιο γρήγορος εάν

είναι ευκολότερο να υπολογίσουμε τις τιμές της dx/dt ευκολότερα από τις τιμές της ίδιου του x(t). Για ένα ευθύγραμμο τμήμα η dx/dt είναι σταθερά.

Από την άλλη μεριά, ίσως ανησυχούμε για την συσσώρευση των σφαλμάτων στρογγύλευσης και του σφάλματος από την μεταβολή του dx/dt καθώς το t μεταβάλλεται στο διάστημα δ.

Μα

θη

μα

τικ

οί

Υπολογισ

μοί

9

Φωτοσκίαση Ευθύγραμμου Τμήματος (2)

Μπορούμε να μετασχηματίσουμε το πρόγραμμα #1 έτσι ώστε αυτό να χρησιμοποιεί υπολογισμούς παραγώγων. Αυτό αντικαθιστά έναν πολλαπλασιασμό με μια πρόσθεση, που εκτελείται ταχύτερα.proc DrawLine (x, y : int; c : colour)

var yt, m : real var yi : int yt := 0 m := y / x for xi : 0..x

yi := floor (yt + 1/2) PutPixel (xi, yi, c) yt += m

end for end DrawLine

Κάνει το παραπάνω πρόγραμμα ακριβώς αυτό που κάνει και το πρόγραμμα #1;

Μα

θη

μα

τικ

οί

Υπολογισ

μοί

10

Φωτοσκίαση Ευθύγραμμου Τμήματος (3)

Μπορούμε να απαλείψουμε την πρόσθεση του ½ σε κάθε βήμα της ανακύκλωσης ως εξής:proc DrawLine (x, y : int; c : colour)

var ys, m : real

var yi : int

ys := 1/2

m := y / x

for xi : 0..x

yi := floor(ys)

PutPixel (xi, yi, c)

ys += m

end for

end DrawLine

Μα

θη

μα

τικ

οί

Υπολογισ

μοί

11

Φωτοσκίαση Ευθύγραμμου Τμήματος (4)Μετά, διασπάμε το ys σε δυο μεταβλητές, ysi και ysf, το ακέραιο και το

δεκαδικό μέρος του αντίστοιχα. Το ακέραιο μέρος κατευθείαν καθορίζει την y συντεταγμένη του προς φωτοσκίαση εικονιδίου:proc DrawLine (x, y : int; c : colour)

var ysf, m, mm : real var ysi : int m := y / x mm := m 1 ysi := 0 ysf := 1/2 for xi : 0..x

PutPixel (xi, ysi, c) if (ysf+m?=1) then

ysi += 1 ysf += mm

else ysf += m

end if end for

end DrawLine

Μα

θη

μα

τικ

οί

Υπολογισ

μοί

12

Φωτοσκίαση Ευθύγραμμου Τμήματος (5)Τώρα ας απαλλαχθούμε από τις ποσότητες κινητής-υποδιαστολής ysf, m,

και mm, αντικαθιστώντας τες με μια παράσταση τύπου σταθερής-υποδιαστολής σταθμισμένης με 2*x: proc DrawLine (x, y : int; c : colour)

var Ysf, M, MM : int var ysi : int M := 2*y MM := M 2*x ysi := 0 Ysf := x for xi : 0..x

PutPixel (xi, ysi, c) if (Ysf+M?=2*x) then

ysi += 1 Ysf += MM

else Ysf += M

end if end for

end DrawLine Πώς, η αλλαγή από παραστάσεις κινητής-υποδιαστολής σε σταθερής-

υποδιαστολής αλλάζει το τι κάνει το πρόγραμμα;

Μα

θη

μα

τικ

οί

Υπολογισ

μοί

13

Φωτοσκίαση Ευθύγραμμου Τμήματος (6)Τέλος, ορίζουμε

r = Ysf + M 2*x = 2*y + 2*(ysf 1)*x Αυτό μας επιτρέπει να ελέγχουμε εάν Ysf + M >= 2*x ελέγχοντας εάν r >= 0. Έτσι καταλήγουμε στον Αλγόριθμο του Bresenham:

proc DrawLine (x, y : int; c : colour) var r, M, MM : int var ysi : int M := 2*y MM := M 2*x ysi := 0 r := 2*y x for xi : 0..x

PutPixel (xi, ysi, c) if (r?=0) then

ysi += 1 r += MM

else r += M

end if end for

end DrawLine

Μα

θη

μα

τικ

οί

Υπολογισ

μοί

14

Φωτοσκίαση Κύκλου

Μπορούμε να φωτοσκιάσουμε έναν κύκλο χρησιμοποιώντας την πρώτη στρατηγική, χρησιμοποιώντας τιμές παραγώγων.

Ένας κύκλος ακτίνας r και κέντρο στην αρχή των αξόνων μπορεί να παρασταθεί παραμετρικά ως εξής:

x(u) = r cos(u); y(u) = r sin(u)

Αυτό αντιστοιχεί στην εξής διαφορική μορφή:

dx/du (u) = - r sin(u), dy/du (u) = r cos(u).

Αυτό φαίνετε ότι είναι τόσο χρονοβόρο όσο και το αρχικό, μέχρι να συνειδητοποιήσουμε ότι είναι ισοδύναμο του

dx/du (u) = - y(u), dy/du (u) = x(u).

Η στρατηγική μας: Ξεκίνα με x(0) = r, y(0) = 0, και προχώρα με μικρά βήματα στο u, χρωματίζοντας τα εικονίδια καθώς τα προσπελάς. Επέλεξε το μήκος του βήματος αρκετά μικρός έτσι ώστε να μην δημιουργούνται διάκενα.

Μα

θη

μα

τικ

οί

Υπολογισ

μοί

15

1η Υλοποίηση

Για να υλοποιήσουμε την παραπάνω στρατηγική, πρέπει να ρυθμίσουμε μερικές λεπτομέρειες.

Αφού θέσουμε x(0) = r και y(0) = 0, μπορούμε να

επαναλάβουμε συνεχώς, για κάποιο μήκος βήματος δ, το παρακάτω:

x(u + δ) = x(u) – y(u)δ

y(u + δ) = y(u) – x(u)δ.

Επιλέγουμε σαν μήκος βήματος, δ, το 1/r. Τότε, η συνολική απόσταση που διανύουμε σε κάθε βήμα θα πρέπει να είναι 1, οπότε δεν θα παραλείψουμε εικονίδια.

Χρειάζεται να συνεχίσουμε εκτελώντας 2π/δ βήματα έτσι ώστε να ολοκληρώσουμε το δρόμο μας.

Μα

θη

μα

τικ

οί

Υπολογισ

μοί

16

Το Αποτέλεσμα για r = 12

Μα

θη

μα

τικ

οί

Υπολογισ

μοί

17

2η Υλοποίηση

Μπορούμε να σταματήσουμε την προς τα έξω ελικοειδή κίνηση του κύκλου αλλάζοντας τις επαναλήψεις με τις εξής:

x(u + δ) = x(u) – y(u)δ

y(u + δ) = y(u) – x(u+δ)δ.

Γιατί δουλεύει αυτό;

Δεν επιτρέπει περιοχές σημείων να «επεκταθούν», επειδή κάθε βήμα είναι ένας «αποκομμένος» μετασχηματισμός ο οποίος δεν μεταβάλει το εμβαδόν μιας περιοχής:

Μα

θη

μα

τικ

οί

Υπολογισ

μοί

18

Το Αποτέλεσμα για r = 12 – Νέα Έκδοση