Eigene Bildeffekte programmieren in Processing

Hinzugefügt am von Stephan Thiel
Bilder können uns auch als reine Datengrundlage dienen. Das Beispiel veranschaulicht einen Zeichenprozess der durch die Anteiligkeit der Farbe Rot Ellipsen auf der Zeichenfläche verteilt. Diese werden je nach Stärke des Rotkanals mit einem Grauton gefüllt.

Zum Auslesen des Bildes werden zwei for Schleifen ineinander verschachtelt. Spalte für Spalte werden damit alle Pixel analysiert und jeweils die Entscheidung gefällt ob eine Ellipse an dieser Position gezeichnet werden soll oder nicht (wenn Rotanteil größer als 190 ist).

Der Sketch

// Zeichenfläche auf Größe des
// zu ladenden Bildes festlegen
size (400, 375);
// Kantenglättung aktivieren
smooth ();
// Outline deaktivieren
noStroke ();
// Hintergrund abdunkeln
background (10);
 
// Variable "img" zum halten des
// Bildes festlegen. Bild hinein laden.
PImage img = loadImage ("lego.jpg");
 
// Schleife für die Pixelzeilen des Bildes
for (int px = 0; px < img.width; px = px + 1) {
  // Schleife für die Pixelreihen des Bildes
  for (int py = 0; py < img.height; py = py + 1) {
   
    // Farbwert des Bildpixels an der Position px,py
    color c = img.get (px, py);
    // Rotanteil aus der Farbe "c"
    float r = red (c);
   
    // Wenn der Rotanteil größer als 190 ist
    if (r > 190) {
      // Füllfarbe aus Bild übernehmen
      fill (img.get (px, py));
      // Kreis an der Bild-Pixelposition
      // im Sketchfenster zeichnen
      ellipse (px, py, 3, 3);
    }
  }
}