Processingによるメディアアート製作記録4 ウェブカメラを取り込む【プログラミング】

メディアアート超入門の第4回目は、ウェブカメラを扱ってみたいと思います。

過去ログ

【メディアアート超入門】Processingによるメディアアート製作記録
【メディアアート超入門】Processingによるメディアアート製作記録2 画像を取り込む

【メディアアート超入門】Processingによるメディアアート製作記録3 作品：銀河鉄道の夜Processingでカメラを扱うのは案外簡単で、基本的にはビデオライブラリをインポートしてくるだけでProcessingの実行画面にカメラの映像を反映できます。

まずは[スケッチ]の[ライブラリをインポート]でビデオ用のライブラリをダウンロードしてきます。あとはビデオの定義や画面の大きさを定義するだけで簡単にウェブカメラの映像をリアルタイムで取り込めます。

こんな感じで取り込めます。描いたコードは10行ちょっとの短いコードのみです。

————————————————————–

import processing.video.*;

Capture video;

void setup() {

size(640, 480);

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

video.start();

}

void draw() {

if (video.available() == true) {

video.read();

image(video, 0, 0);

}

————————-————————————-

今回はここにちょっと修正を加え、マウスで指定した場所のカメラの映像の色の情報を引き出してみたいと思います。
といっても加えるのは以下の4行のみです。
————————-————————————-

stroke(0);

int x = mouseX;

int y = mouseY;

text(video.pixels[y*width + x],20,20);
————————————————————–
「mouseX」「mouseY」はマウスのカーソルの位置を表すProcessingの関数で、カーソルの場所が何ピクセル目にあるのかが自動で吐き出されます。
「text」でピクセルの位置の色を表示するようにしてあげれば、マウスのカーソルの位置の色情報が表示されます。

少しわかりずらいですが、画面の右上に色の番号が表示されます。
マウスの移動に合わせてリアルタイムでカーソル位置のカメラの色が表示されます。