2014年03月25日

プロジェクションマッピングという言葉が自分がプログラミングを始めた時には
想像もできないくらいに一般に広く通じるようになった今の時代に
今自分がプロジェクションマッピングができるかというとあまり自信をもって頷けない部分が
あった。というのも自分が初めてプロジェクションマッピングに挑戦したかった/した時は
プログラムもそんなに詳しくなかったし、プロジェクションマッピングという言葉も一部の
メディアアート精通者くらいしか知らず、方法もあまりインターネット上に公開されて
いなかったのでmadmapperというソフトウェア頼りになってしまい
それからも数少ないがマッピングのようなことをする場合はこのソフトに頼ってきたので
プロジェクションマッピングができるといってもほぼソフトウェアのおかげ様だった。
よって、あまりマッピングができるとは言えなかった。
ということで特に使用する予定はないがそろそろソフトウェアに頼らずできるんじゃないかと
思い、いろいろ試してなんとか最低限の形になったので方法をメモとして残そうと思う。



ということでまずopenFrameworks プロジェクションマッピングあたりで検索をかけたら
ofxQuadWarpというアドオンがあるらしくこれを使えばめっちゃ簡単にできる気がした。
完成形のイメージはやはりmadmapperで使用すれば通じると思うけれど投影の為の
キャリブレーションをする画面と素材の映像を出す画面をわける形を目指した。

参考:http://yoppa.org/blog/4965.html

ofxQuadWarpはofxOpenCvとofxMSAInteractiveObjectのアドオンが必要みたいなのでそれと合わせて新規プロジェクトを作成し、
まずexampleを適当に改造して複数の画像を読み込むテストを行った。


test_quadwarp
testApp.h

#pragma once
 
#include "ofMain.h"
#include "ofxQuadWarp.h"
 
#define NUM 5//画像の数
 
 
class testApp : public ofBaseApp{
 
	public:
		void setup();
		void update();
		void draw();
 
		void keyPressed(int key);
		void keyReleased(int key);
		void mouseMoved(int x, int y );
		void mouseDragged(int x, int y, int button);
		void mousePressed(int x, int y, int button);
		void mouseReleased(int x, int y, int button);
		void windowResized(int w, int h);
		void dragEvent(ofDragInfo dragInfo);
		void gotMessage(ofMessage msg);
 
    ofxQuadWarp         warper[NUM];
    ofImage             img[NUM];
    ofFbo               fbo[NUM];
 
 
};




testApp.cpp

#include "testApp.h"
 
//--------------------------------------------------------------
void testApp::setup(){
    ofBackground(0);
    ofSetFrameRate(60);
    ofSetVerticalSync(true);
    ofEnableSmoothing();
 
    img[0].loadImage("imgres.jpg");
    img[1].loadImage("imgres-1.jpg");
    img[2].loadImage("images-1.jpg");
    img[3].loadImage("images.jpg");
    img[4].loadImage("og.jpg");
 
 
    int x = 0;
    int y = 0;
 
    int w[NUM];
    int h[NUM];
    for (int i=0; i<NUM; i++) {
        w[i] = img[i].width;
        h[i] = img[i].height;
        fbo[i].allocate(w[i], h[i]);
 
        warper[i].setSourceRect( ofRectangle( 0, 0, w[i], h[i] ) );
        warper[i].setTopLeftCornerPosition( ofPoint( x, y ) );
        warper[i].setTopRightCornerPosition( ofPoint( x + w[i], y ) );
        warper[i].setBottomLeftCornerPosition( ofPoint( x, y + h[i] ) );
        warper[i].setBottomRightCornerPosition( ofPoint( x + w[i], y + h[i] ) );
        warper[i].setup();
 
        x+=100;
        y+=100;
    }
 
 
 
}
 
//--------------------------------------------------------------
void testApp::update(){
    if(ofGetFrameNum()){
        return;
    }
 
}
 
//--------------------------------------------------------------
void testApp::draw(){
    ofSetColor(255, 255, 255);
 
    for (int i=0; i<NUM; i++) {
        fbo[i].begin();{
            img[i].draw(0, 0);
        }
        fbo[i].end();
 
        ofMatrix4x4 mat = warper[i].getMatrix();
 
        glPushMatrix();
        glMultMatrixf(mat.getPtr());
        {
            fbo[i].draw(0, 0);
        }
        glPopMatrix();
 
        ofSetColor(100, 100, 100);
        ofSetLineWidth(2);
        warper[i].draw();
 
        ofSetColor( ofColor :: white );
    }
 
 
 
 
}
 
//--------------------------------------------------------------
void testApp::keyPressed(int key){
    if( key == 's' ){
        for (int i=0; i<NUM; i++) {
            warper[i].toggleShow();
        }
    }
 
}



実行した結果がこれ
スクリーンショット 2014-03-25 22.07.21
あまりライブラリの意味はわからなかったけどexampleを参考にとりあえず画面複製した。

今の状態では自分の持っている画像を事前に読み込んでおいてそれをつかってマッピングを行う
感じだがそれをプログラムで描画している部分を切り取ってofImageに入れるような感じに
すればよさそうということで次にその部分だけを作った。
ちょっと長くなりそうなのでいくつかに分けようと思います。
(決して投稿数をかさまししてしばらくなにも書かなかったことをごまかしたい訳ではない)

追記
Xcode 5.0
openFrameworks 8.0
OSX 10.8.5


コメントを残す

© Sako.log All Rights Reserved.