21. September 2012
Ein Fraktal ist etwas, das sich selbst immer wiederholt. Deshalb muss beim Programmieren eines Fraktals darauf geachtet werden, dass diese Wiederholungen irgendwann unterbrochen werden, da der Computer sonst schnell überlastet sein und abstürzen kann. Ich wollte mein Fraktal etwas interaktiv gestalten und habe den Code so umgeschrieben, dass die Bewegungen dem Mauszeiger folgen. Dazu musste ich die "noLoop"-Funktion rausnehmen, was mir Anfangs etwas Schwierigkeiten bereitete. Als ich das geschafft hatte, musste ich mir überlegen, wie ich das mit dem Mauszeiger hinbekomme. Dazu habe ich einfach den Bildschirm in vier Bereiche aufgeteilt, in der je eine neue Funktion aufgerufen wird. Im Nachhinein gesehen was das eine ziemlich doofe Vorgehensweise, da ich so jedes mal wenn ich z.B. eine Linienstärke ändern wollte, dies in allen vier Funktionen tun musste. Zudem wurde der gesamte Programmiercode extrem lang und unübersichtlich.void setup() { size(600, 600); // def. fenstergroesse randomSeed(millis()); // seed random smooth(); // aktiviere antialiasing strokeWeight(1); // linienbreite stroke(0, 0, 0, 200); } void draw() { if (mouseX < width*.5 && mouseY < height*.5) //links oben { frameRate(8); background(255); pushMatrix(); translate(width *.5, height*.5); wurzel1(2); popMatrix(); } else if (mouseX < width*.5 && mouseY > height*.5) //links unten { frameRate(8); background(255); pushMatrix(); translate(width *.5, height*.5); wurzel3(2); popMatrix(); } else if (mouseX > width*.5 && mouseY < height*.5) // rechts oben { frameRate(8); background(255); pushMatrix(); translate(width *.5, height*.5); wurzel4(2); popMatrix(); } else { //rechts unten frameRate(8); background(255); pushMatrix(); translate(width *.5, height*.5); wurzel2(2); popMatrix(); } // redraw(); } // funktion links oben void wurzel1(int tiefe) { if (tiefe <=0) // teste ob das ende erreicht worden ist { // zeichen auge pushMatrix(); scale(2); auge(mouseX, mouseY, mouseX-mouseY); popMatrix(); return; } // zeichne zweige int x; int y; int count = (int)random(1, 6); for (int i = 0; i < count;i++) { x = (int)random(-100, 10); y = (int)random(-150, 10); line(0, 0, x, y); pushMatrix(); translate(x, y); scale(random(.3, .95)); wurzel1(tiefe-1); popMatrix(); } } // funktion rechts void wurzel2(int tiefe) { if (tiefe <=0) // teste ob das ende erreicht worden ist { // zeichen auge pushMatrix(); scale(2); auge(mouseX, mouseY, mouseX-mouseY); popMatrix(); return; } // zeichne zweige rechts int x; int y; int count = (int)random(1, 6); for (int i = 0; i < count;i++) { x = (int)random(-10, 100); y = (int)random(-10, 150); line(0, 0, x, y); pushMatrix(); translate(x, y); scale(random(.3, .95)); wurzel2(tiefe-1); popMatrix(); } } // funktion links unten void wurzel3(int tiefe) { if (tiefe <=0) // teste ob das ende erreicht worden ist { // zeichen auge pushMatrix(); scale(2); auge(mouseX, mouseY, mouseX-mouseY); popMatrix(); return; } // zeichne zweige int x; int y; int count = (int)random(1, 6); for (int i = 0; i < count;i++) { x = (int)random(-150, 10); y = (int)random(-10, 150); line(0, 0, x, y); pushMatrix(); translate(x, y); scale(random(.3, .95)); wurzel2(tiefe-1); popMatrix(); } } // funktion oben rechts void wurzel4(int tiefe) { if (tiefe <=0) // teste ob das ende erreicht worden ist { // zeichen auge pushMatrix(); scale(2); auge(mouseX, mouseY, mouseX-mouseY); popMatrix(); return; } // zeichne zweige rechts int x; int y; int count = (int)random(1, 6); for (int i = 0; i < count;i++) { x = (int)random(-10, 150); y = (int)random(-150, 10); line(0, 0, x, y); pushMatrix(); translate(x, y); scale(random(.3, .95)); wurzel2(tiefe-1); popMatrix(); } } //zeichne augen void auge(int colorR, int colorG, int colorB) { noFill(); strokeWeight(4); arc(0, 0, 50, 50, radians(180+25), radians(360-25)); arc(0, -21, 50, 50, radians(25), radians(180-25)); arc(0, -3, 50, 31, radians(180+25), radians(360-25)); fill(colorR, colorG, colorB); ellipse(0, -7, 20, 20); fill(255); ellipse(-3, -10, 8, 8); }Als weiteren Schritt habe ich ausprobiert was passiert, wenn man den Hintergrund nicht jedes Mal neu zeichnet und habe herausgefunden, dass man so noch lustige Bilder zeichnen kann: Arrays Zudem haben wir in dieser Lektion gelernt, wie man anhand von Arrays einfach mehrere Bilder laden kann. Als Übung mussten wir bei den Planeten-Bildern den schwarzen Hintergrund entfernen, sodass er transparent wird. Die Hintergründe habe ich jeweils mit Photoshop entfernt und dann in Programmcode einfach die Namen der Bilder angepasst.
PImage[] imageList = null; // variable sauber initialisieren void setup() { size(600,600); // def. fenstergroesse imageList = new PImage[4]; imageList[0] = loadImage("./images/1.png"); imageList[1] = loadImage("./images/2.png"); imageList[2] = loadImage("./images/3.png"); imageList[3] = loadImage("./images/4.png"); } void draw() { background(255); pushMatrix(); translate(10,100); for(int i=0;i < imageList.length; i++) { image(imageList[i],0,0,140,140); translate(150,0); } popMatrix(); }