7 ο Εργαστήριο Θόρυβος 2Δ, Μετακίνηση, Περιστροφή O θόρυβος 2Δ μας δίνει τη δυνατότητα να δημιουργίας υφής 2Δ. Στο παρακάτω παράδειγμα, γίνεται σχεδίαση γραμμών σε πλέγμα 300x300 με μεταβαλόμενη τιμή αδιαφάνειας (alpha) η οποία καθορίζεται από τη συνάρτηση noise με χρήση 2Δ. Αρχικό σημείο θορύβου με τυχαίο αριθμό από 0 έως 10 Το ίδιο και για τις δύο διαστάσεις του θορύβου x και y. Επανάληψη for που διατρέχει κατακόρυφα τον καμβά Ο θόρυβος στην συντεταγμένη y αυξάνεται κάθε φορά 0.01 Ο θόρυβος x επαναφέρεται στην τιμή xstart κάθε φορά που αλλάζει γραμμή (for y) Επανάληψη for που διατρέχει οριζόντια τον καμβά Ο θόρυβος στην συντεταγμένη x αυξάνεται κάθε φορά 0.01 Η τιμή alpha καθορίζεται με θόρυβο 2Δ. Η noise επιστρέφει τιμές από 0 έως 1. Πολλαπλάσιάζουμε με 255 για να παίρνουμε τιμές από 0 έως 255. Καθορίζεται το χρώμα γραμμής ως μαύρο (0) με τυχαία αδιαφάνεια alph Σχεδιάζεται μια πολύ μικρή γραμμή από το σημείο (x,y) έως το (x+1,y+1) Η λογική του παραπάνω παραδείγματος τροποποιείται ώστε σε κάθε επανάληψη για κάθε γραμμή και στήλη του πλέγματος να καλείται μια συνάρτηση με όνομα drawpoint η οποία θα καθορίζει τι ακριβώς θα σχεδιάζεται. Η χρήση της συνάρτησης drawpoint επιτρέπει να κρατάμε σταθερές τις επαναλήψεις για να διατρέχουμε κάθε σημείο του καμβά και αλλάζοντας μόνο το περιεχόμενο της drawpoint να μεταβάλλουμε το τελικό αποτέλεσμα. Το βήμα αύξησης είναι ίσο με 5 αντί για 1 που ήταν στο προηγούμενο παράδειγμα. Για κάθε σημείο (x,y) καλείται η συνάρτηση drawpoint που δέχεται ως ορίσματα τις συντεταγμένες x και y και τον θόρυβο 2Δ που επιστρέφει η συνάρτηση noise. H drawpoint δέχεται τις συντεταγμένες x,y και την τιμή θορύβου. Η τιμή θορύβου noisefactor * 10 καθορίζει το πλάτος και ύψος του τετραγώνου που θα σχεδιαστεί με το πάνω αριστερό σημείο του στη θέση x,y. 1
Τροποποίηση της drawpoint ώστε σε κάθε σημείο του καμβά να σχεδιάζεται μια γραμμή μήκους 20-pixel η οποία περιστρέφεται κατά μια γωνία από 0 ο έως 360 ο η οποία καθορίζεται από την τιμή θορύβου noisefactor. Ο υπολογισμός των συντεταγμένων των δύο σημείων γραμμής που θα έχει μια συγκεκριμένη γωνία απαιτεί αρκετούς μαθηματικούς υπολογισμούς. Σε αυτή τη περίπτωση είναι πιο εύκολο να σχεδιάζουμε πάντα μια οριζόντια γραμμή στην αρχή του συστήματος συντεταγμένων μήκους 20 pixel, δηλ. από το σημείο (0,0) έως το σημείο (20,0), και να μετακινούμε και να περιστρέφουμε το σύστημα συντεταγμένων κατάλληλα ώστε η γραμμή να σχεδιαστεί στην επιθυμητή θέση κάνοντας χρήση των αντίστοιχων συναρτήσεων translate() και rotate(). translate(x,y) Αν για παράδειγμα καλέσουμε σε ένα πρόγραμμα την translate(10,5) αυτό θα σημαίνει ότι κάθε σχήμα που θα σχεδιαστεί στη συνέχεια θα είναι μετατοπισμένο κατά 10 pixels οριζόντια και 5 pixels κάθετα. Συνεπώς, αν η επόμενη εντολή από την translate(10,5) είναι η point(0,3) τότε στην οθόνη θα σχεδιαστεί ένα σημείο στη θέση (10,8). rotate(angle) H συνάρτηση rotate(angle) περιστρέφει το σύστημα συντεταγμένων κατά γωνία angle, η οποία προσδιορίζεται σε rad (ακτίνια). Οι θετικές γωνίες κάνουν δεξιόστροφη περιστροφή. Η μετακίνηση και η περιστροφή είναι μετασχηματισμοί που εφαρμόζονται στο σύστημα συντεταγμένων. Τα προγράμματα της Processing χρησιμοποιούν εσωτερικά έναν πίνακα μετασχηματισμού για να μπορούν να κάνουν μετακίνηση ή περιστροφή. Ο πίνακας μετασχηματισμού είναι ένα σύνολο αριθμών που καθορίζει πως θα σχεδιαστούν στην οθόνη τα γεωμετρικά σχήματα. H εφαρμογή μετασχηματισμών όπως translate() και rotate() έχουν σαν αποτέλεσμα να τροποποιούν αυτόν τον πίνακα και κάνουν τα γεωμετρικά σχήματα να σχεδιάζονται διαφορετικά. Όταν εφαρμόζουμε πολλές rotate() και translate() το αποτέλεσμά τους συσσωρεύεται στον πίνακα μετασχηματισμού. Η συνάρτηση pushmatrix() χρησιμοποιείται ώστε να καταγραφεί η τρέχουσα κατάσταση όλων των μετασχηματισμών ώστε ένα πρόγραμμα να μπορεί να επιστρέψει σε αυτή τη κατάσταση αργότερα καλώντας τη συνάρτηση popmatrix(). Στο παρακάτω παράδειγμα χρησιμοποιούμε την pushmatrix() και popmatrix() γιατί η drawpoint θα καλείται πολλές φορές και θέλουμε κάθε φορά να γίνεται μια μετακίνηση και μια περιστροφή. Αν δεν είχαμε την pushmatrix() και 2
popmatrix() τότε κάθε φορά εκτελούσαμε όλες τις μετακινήσεις και περιστροφές από την πρώτη έως και την τρέχουσα εκτέλεση της drawpoint. Άλλο ένα παράδειγμα υλοποίησης της drawpoint η οποία μεταβάλει την περιστροφή, το μέγεθος, το χρώμα και την αδιαφάνεια των ελλείψεων που σχεδιάζονται. Το αποτέλεσμα είναι σαν αυτό που φαίνεται στην παρακάτω εικόνα. 3
Παράδειγμα 2Δ θορύβου με animation H drawpoint παραμένει όπως στο προηγούμενο παράδειγμα. Σε κάθε frame αυξάνεται το σημείου αρχής του θορύβου (xstartnoise, ystartnoise) για να δώσει την αίσθηση της κίνησης. 4
Παράδειγμα 2Δ θορύβου με animation και θόρυβο στη κίνηση 5