Page Comparison

...

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();

...

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);

Image RemovedFolgend 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();
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();
}

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