1 ΤΕΙ Θεσσαλονίκης Τμήμα Πληροφορικής Γραφικά Υπολογιστών: Αλγόριθμοι Σχεδίασης Γραμμών Πασχάλης Ράπτης http://aetos.it.teithe.gr/~praptis praptis@it.teithe.gr
2 Περιεχόμενα Τι είναι το pixel; Δειγματοληψία Προβλήματα στην σχεδίαση γραμμών Εξίσωση γραμμών Σχεδίαση γραμμών (Scan converting algorithms) Απλός αλγόριθμος-1 Αυξητικός αλγόριθμος (DDA algorithm) Σύνοψη
3 Pixel Το pixel είναι ένα σημείο δεν έχει διάσταση δεν καταλαμβάνει επιφάνεια δεν μπορούμε να το δούμε έχει συντεταγμένες Το σημείο είναι ένα δείγμα (sample)
4 Δείγμα Τα περισσότερα πράγματα στον πραγματικό κόσμο είναι συνεχόμενα (continouus) ενώ στους Η/Υ είναι διακριτά (discrete). Η διαδικασία αναπαράστασης μιας συνεχούς συνάρτησης σε μια διακριτή ονομάζεται δειγματοληψία. Δειγματοληψία χρησιμοποιείται για την παρουσίαση και την απόδοση (render) μιας εικόνας στους Η/Υ.
5 Εικόνα Μια εικόνα είναι μια συνάρτηση από εντάσεις φωτεινότητος (intensities). Μια εικόνα δεν μπορεί να παρουσιασθεί ως μια αναλυτική συνεχή συνάρτηση. Αναπαριστούμε μια εικόνα ως πινακοποιημένες (tabulated) συναρτήσεις
6 Πλέγμα δειγματοληψίας (Sampling Grid) Δημιουργούμε διακριτές τιμές για τον πίνακα από τη συνεχή εικόνα
7 Δειγματοληψία εικόνας Το αποτέλεσμα είναι ένα σύνολο από σημειοδείγματα ή pixels. Η ίδια ανάλυση μπορεί να εφαρμοσθεί και στα γεωμετρικά σχήματα.
8 Παράδειγμα Ταύτισης-Aliasing Εμφάνιση ζιγκ-ζαγκ της ακμής.
9 Παράδειγμα Ταύτισης-Aliasing (2) Απώλεια λεπτομερειών.
10 Rasterization Scan Conversion Rasterization - είναι η διαδικασία που καθορίζει ποια pixels δίνουν την καλύτερη αναπαράσταση γραφικών αντικειμένων. Scan conversion (σάρωση μετατροπής) - είναι ο συνδυασμός του rasterization και της δημιουργίας (εμφάνισης) γραφικών αντικειμένων με την διαδικασία της σάρωσης γραμμής (scan line)
11 Σχεδίαση Γραμμών Ένα κομμάτι γραμμής σε μια σκηνή ορίζεται από τις συντεταγμένες των άκρων της γραμμής y (7, 5) (2, 2) x
12 Πρόβλημα Εμφάνιση ευθείας γραμμής σε pixel-οθόνη (pixel based display) ως τεθλασμένη Ελάχιστο πάχος γραμμής 1 pixel. Πως επιλεγούμε ποια pixel θα ανάψουν;
13 Πρόβλημα Εμφάνιση ευθείας γραμμής σε pixel-οθόνη (pixel based display) ως τεθλασμένη Καλύτερη εμφάνιση γραμμής: 1. Όταν είναι παράλληλη προς κάποιον άξονα 2. Όταν η γραμμή έχει κλήση 45 ο Πως επιλεγούμε ποια pixel θα ανάψουν για τις ευθείες με διαφορετική κλήση;
14 Θέματα σχεδιασμού Γενικές απαιτήσεις: Οι ευθείες γραμμές πρέπει να παρουσιάζονται (αναπαριστώνται) ως ευθείες γραμμές Καλή εμφάνιση της γραμμής Αποφυγή ζιγκ-ζαγκ Τι πάχος θα εχει; Πως θα ενώνονται μεταξύ τους; Ποια pixels είναι τα σωστά που θα «ανάψουν» Να γίνει γρήγορα Πόσες γραμμές πρέπει να εμφανισθούν (σχεδιαστούν) σε μια κανονική σκηνή; Είναι κάτι που επανέρχεται συχνά;
15 Αντιταύτιση (Antialiasing Αντιταύτιση είναι η διαδικασία της ρύθμισης της έντασης (intensities) φωτεινότητας των pixels κατά μήκος μιας γραμμής για να ελαττωθεί η ταύτιση.
16 Αντιταύτιση-Antialiasing Τρόποι να ελάττωσης της ταύτισης, του ζιγκζαγκ των ακμών και το staircasing: Μεγαλύτερη ανάλυση οθόνης Χρειάζεται όμως μεγαλύτερη μνήμη (frame buffer) Τεχνικές αντιταύτισης Μεταβολή στην ένταση (φωτεινότητας) των pixels κατά μήκος των ορίων για εξομάλυνση των ακμών.
17 Παράδειγμα Ταύτισης-Αντιταύτισης Τα ζιγκ-ζαγκ και τα «σκαλοπάτια» πριν την αντιταύτιση Ταύτιση
18 Παράδειγμα Ταύτισης-Αντιταύτισης Εμφανίζοντας γκρι pixels γύρω από τις γραμμές μιας εικόνας -θαμπές γραμμέςελαττώνεται το ζιγκ-ζαγκ και κανει τα αντικείμενα να φαίνονται πιο ρεαλιστικά. Αντιταύτιση
19 Εξίσωση Γραμμής Εξισώσεις που χρησιμοποιούμε στην σχεδίαση γραμμών y Εξίσωση γραμμής: y end y 0 όπου: y = m x + m = y x end end b y x 0 0 x 0 x end x b = y m x 0 0
20 Γραμμές και Κλήση (Slope) Γραμμής Η κλήση μιας γραμμής (m) ορίζεται από τις συντεταγμένες της αρχής και του τέλους της γραμμής Παραδείγματα γραμμών και οι κλήσεις τους. m = -4 m = -2 m = m = 4 m = 2 m = -1 m = 1 m = - 1 / 2 m = - 1 / 3 m = 1 / 2 m = 1 / 3 m = 0 m = 0
21 Μια απλή λύση (Αλγόριθμος 1) Για κάθε μια τιμή του x βρίσκουμε το αντίστοιχο y Παράδειγμα: y 5 (7, 5) 2 (2, 2) 2 7 x
22 Μια απλή λύση (Αλγόριθμος 1) (2) 5 4 3 2 1 0 0 1 2 3 4 5 6 7
23 Μια απλή λύση (Αλγόριθμος 1) (3) 5 2 y (2, 2) 2 3 4 5 6 7 (7, 5) x Ευρεση του m και του b: m = b = 5 2 3 = 7 2 5 3 2 2 = 5 Για κάθε τιμή του x βρίσκουμε την τιμή του y: y( 3) = 3 4 3 + = 5 5 y( 5) = 3 4 5 + = 5 5 3 2 5 4 3 5 y( 4) = 3 4 4 + = 5 5 y( 6) = 3 4 6 + = 5 5 1 3 5 2 4 5 4 5
24 Μια απλή λύση (Αλγόριθμος 1) (4) Στρογγυλοποιούμε και ανάβουμε τα αντίστοιχα pixels για να σχεδιάσουμε την γραμμή 7 6 5 4 3 2 1 0 0 1 2 3 4 5 6 7 8 3 y( 3) = 2 5 1 y( 4) = 3 5 4 y( 5) = 3 5 2 y( 6) = 4 5 3 3 4 4
25 Μια απλή λύση (Αλγόριθμος 1) (5) Αυτή η προσέγγιση είναι πολύ αργή, επειδή: Η εξίσωση y = mx + b απαιτεί τον πολ/σμό του m με το x Στρογγυλοποίηση της τιμής της y συντεταγμένης Χρειαζόμαστε μια πιο γρήγορη λύση
26 Κλήση γραμμών Μια σημείωση για τις κλήσεις των γραμμών (Προηγούμενο παράδειγμα: Υπολογίζουμε τις y τιμές για κάθε x) Αν λύσουμε ως προς x Έχουμε: m όπου: m και y x = 0 y b = end 0 b = y m x 0 0 x end y x
27 Κλήση γραμμών (2) Αφήνοντας τις λεπτομέρειες έχουμε: 2 1 x( 3) = 3 4 x( 4) = 5 5 3 3 Δεν έχει καλή εμφάνιση. Επιλεγούμε τον τρόπο 4 για να εμφανίσουμε 3 τα pixels της γραμμής 2 1 που βασίζεται στην 0 κλήση της γραμμής 0 1 2 3 4 5 6 7 8 7 6 5
m = 0 m = 0 28 Κλήση γραμμών (3) Εάν η κλήση της γραμμής είναι μεταξύ -1 και 1 τότε οι τιμές του y υπολογίζονται με βάση τις τιμές του x Διαφορετικά οι x τιμές υπολογίζονται με βάση τις τιμές του y m = -1 m = -4 m = -2 m = m = 4 m = 2 m = 1 m = - 1 / 2 m = - 1 / 3 m = 1 / 2 m = 1 / 3
29 Κλήση γραμμών (4) 5 4 3 2 1 0 0 1 2 3 4 5 6 7
30 Αυξητικός Αλγόριθμος 2 (DDA) Ο DDA (digitizer differential analyzer) είναι ένας αυξητικός scan conversion αλγόριθμος. Ο αλγόριθμος υπολογίζει το y k+1 βασιζόμενος στο y k που έχει υπολογισθεί The original digitizer differential analyzer (DDA) was a physical machine developed by Vannevar Bush at MIT in the 1930 s in order to solve ordinary differential equations. More information here.
31 Αυξητικός Αλγόριθμος 2 (DDA) Παίρνουμε το σύνολο των σημείων που υπολογίσαμε (καθορίσαμε) για την γραμμή σε προηγούμενο παράδειγμα: (2, 2), (3, 2 3 / 5 ), (4, 3 1 / 5 ), (5, 3 4 / 5 ), (6, 4 2 / 5 ), (7, 5) Σημειώστε, ότι οι τιμές του x αυξάνονται κατά ένα, ενώ οι τιμές του y απλώς αυξάνονται κατά την κλήση της γραμμής (3/5 στο παράδειγμα). (Η κλήση της γραμμής υπολογίζεται μια φορά) Αυτή είναι η βασική ιδέα (key insight) στο αλγόριθμο του DDA
Αυξητικός Αλγόριθμος (DDA) Όταν η κλήση της γραμμής είναι μεταξύ του -1 και του 1, ξεκίνα από το πρώτο σημείο της γραμμής και αυξάνοντας την x συντεταγμένη κατά 1, υπολόγισε τις αντίστοιχες τιμές του y με την: y = y + k + 1 k Όταν η κλήση είναι εκτός αυτών των ορίων (-1,1), αυξάνεις την y συντεταγμένη κατά 1 και υπολογίζεις τις αντίστοιχες x τιμές με την : x k + = x + 1 k m 1 m
33 Αυξητικός Αλγόριθμος 2 (DDA) Και πάλι όμως οι τιμές που υπολογίζονται από τις εξισώσεις του αλγόριθμου DDA πρέπει να στρογγυλοποιηθούν για ταιριάζουν με τις τιμές των pixel. (x k +1, round(y k +m)) (round(x k + 1 / m ), y k +1) (x k, y k ) (x k +1, y k +m) (x k, y k ) (x k + 1 / m, y k +1) (x k, round(y k )) (round(x k ), y k )
34 Γραμμές και Κλήση Το χάσμα (gap) συμβαίνει για κλίσεις γραμμών μεγαλύτερες του 1
35 Αυξητικός Αλγόριθμος 2 (DDA) Ο αυξητικός αλγόριθμος (DDA) είναι περισσότερο γρήγορος από τον αλγόριθμο 1 που εξετάσαμε προηγουμένως Ειδικά, δεν περιλαμβάνει κανέναν πολ/σμό Παρ όλα αυτά υπάρχουν ακόμη δύο μεγάλα θέματα: Η συγκέντρωση (accumulation) των λαθών στην στρογγυλοποίηση μπορεί να κάνει την εμφανιζόμενη (pixelated) γραμμή να αποκλίνει (drift away) από την αρχική σχεδίαση Οι πράξεις στρογγυλοποίησης και κινούμενης υποδιαστολής (floating point arithmetic) που εμπλεκονται είναι χρονοβόρες (time consuming)
36 Σύνοψη Η σχεδίαση γραμμών σε πλεγματικές οθόνες είναι χρονοβόρα για αυτό χρειαζόμαστε καλύτερους τρόπους σχεδίασης. Ο αυξητικός αλγόριθμος είναι ένας αρκετά καλός αλγόριθμος αλλά υπάρχουν και καλύτεροι (όπως ο αλγόριθμος σχεδίασης γραμμών του Bresenham).