Page Comparison

Processing 04

In diesem Tutorial werden wir uns ansehen, wie wir mit einem Live-Bild arbeiten können. Glücklicherweise haben die neuesten Notebook-Computer eigebaute Web-Kameras und wir können deren Informationen direkt verwenden.

Kamerabild auslesen

In einem ersten Schritt wollen wir das Kamerabild auslesen und auf der Zeichenfläche darstellen. Dazu verwenden wir die Video Libary, welche schon n der Standart-Installation von Processing enthalten ist.
Um die Kamera auszulesen importieren wir die Libary und deklarieren einen Namen:

import processing.video.*;

...

Capture video;

Im In der setup() initialisieren  Funktion initialisieren wir die Library und starten die Aufnahme:

video = new Capture(this, width, height, 30);

...

video.start();

Im Die verschiedenen Auflösungen können wir mit println(Capture.list()); uns in die Konsole schreiben lassen.

In der draw() fragen  Fuktion fragen wir ab, ob ein neuer Frame neues Bild vorhanden ist und lesen diesen dieses dann ein:

if (video.available())

...

 {

...

  video.read();

...

}

Zum Schluss zeichnen wir das Bild auf die Zeichenfläche:

image(video, 0, 0);

...

Folgend das komplette Processing-Sketch:

import processing.video.*;
Capture video;

void setup()  {
  size(640, 480);
  video = new Capture(this, width, height, 30);
  video.start();
}

void draw() {
  if (video.available()) {
    video.read();
  }
  
  image(video, 0, 0);
}

Filter und Video

Grundsätzlich lassen sich alle Filter und Effekte, welche wir auf statische Bilder angewendet haben auch auf Video-Sourcen anwenden. Im folgenden ein Paar Beispiele.

Pixelate

Image Added

Das Beispiel “P04_2_Video_Kamerabild_Pixelate” verwendet den gleichen Filter wie im Beispiel “P03_7_Pixels_Pixelate” und löst das Bild gröber auf.

Image Removed

Beispiel “P04_3_Video_Kamerabild_Threshold” arbeitet wieder folgende Beispiel verwendet den den "Pixelate" Filter um das Video grober aufzulösen:

import processing.video.*;
Capture video;

int pixelSize = 20;

void setup() {
  size(640, 480);
  video = new Capture(this, width, height, 30);
  video.start();
}

void draw() {
  if (video.available()) {
    video.read();
  }
  
  for(int x=0; x<width; x+=pixelSize) {
    for(int y=0; y<height; y+=pixelSize) {
      int loc = x+y*width;
      
      color c = video.pixels[loc];
      
      fill(c);
      noStroke();
      rect(x, y, pixelSize, pixelSize);
    }
  }
}

Threshold

Image Added

Das folgende Beispiel arbeitet mit einem Grenzwert und zeigt die Pixel entweder Schwarz oder Weiss dar (vrgl. Beispiel “P03_9_Pixels_Threshold”).

Image Removed

Weitere Filter

Für Bilder gibt es auch schon eine Menge von vorgefertigten Filtern. Diese können unter diesem LINK gefunden werden.

...

:

import processing.video.*;
Capture video;

int threshold = 100;

void setup() {
  size(640, 480);
  video = new Capture(this, width, height, 30);
  video.start();
}

void draw() {
  if (video.available()) {
    video.read();
  }
  
  loadPixels();
  
  for(int x=0; x<width; x++) {
    for(int y=0; y<height; y++) {
      int loc = x+y*width;
      
      if(brightness(video.pixels[loc])<threshold) {
        pixels[loc] = color(255);
      } else {
        pixels[loc] = color(0);
      }
    }
  }

  updatePixels();
}

Spiegeln

Je nach Anwendung kann es von Vorteil sein, wenn man das Bild spiegelt. Vor allem bei Interaktionen vor einem Bildschirm macht dies Sinn. Im Beispiel “P04_4_Video_Kamerabild_spiegeln” ist gezeigt wie es geht. Im Prinzip drehen wir das komplette Video horizontal um 180°. Dies machen wir mit
pushMatrix();
:

pushMatrix();
scale(-1,1);
image(video, -width, 0);
popMatrix();

Folgend das komplette Processing-Sketch:

import processing.video.*;
Capture video;

void setup() {
  size(640, 480);
  video = new Capture(this, width, height, 30);
  video.start();
}

void draw() {
  if (video.available()) {
    video.read();
  }
  
  pushMatrix();
  scale(-1,1);

...

  image(video, -width, 0);

...

  popMatrix();

...

Weiteres:

...

}

Weitere Filter

Für Bilder gibt es auch schon eine Menge von vorgefertigten Filtern. Diese können unter diesem Link gefunden werden.

Weiteres

• Video – Referenz auf processing.org