読者です 読者をやめる 読者になる 読者になる

ProcessingでPerfumeの3Dスキャンデータを表示してみた

PerfumeのGLOBAL SITEで3人を3Dスキャンしたデータが配布されています。このデータを使ってあれこれ加工するのは自分には難しいけど、表示してみるくらいならできるだろうってことで、Processingを使ってみることにしました。

配布されている3Dスキャンのデータは2種類あって、ダウンロードしたのはOBJの方。ProcessingでOBJファイルを扱う為のライブラリ、「OBJLoader」もダウンロードする。

saitoobjloader - Processing OBJLoader library - Google Project Hosting

実際にコードを書くスケッチのファイル名はなんでもいいんですが、今回はperfume_3d.pdeとしました。フォルダ構成は以下の通り。

perfume_3d
│  perfume_3d.pde
│
├─code
│   OBJLoader.jar
│
└─data
      model1.obj
      model2.obj
      model3.obj
      perfume.mtl
      tex.png

スケッチのファイルは同じ名前のフォルダに入ってないと、起動時にエラーが出ます。codeにライブラリファイル、dataにスキャンデータや画像ファイルを保管。

コードはこんな感じ。

import saito.objloader.*;

OBJModel kashiyuka;
OBJModel nocchi;
OBJModel aachan;

void setup(){
  size(640,480,P3D);
  kashiyuka = new OBJModel(this,"model1.obj");
  nocchi = new OBJModel(this,"model2.obj");
  aachan = new OBJModel(this,"model3.obj");
  
  noStroke();
}

void draw() { 
  background(0);
  translate(width/2.0,height+160,0);
  scale(2.5);
  rotateY(radians(frameCount));

  kashiyuka.draw();
  nocchi.draw();
  aachan.draw();
}

実行してみるとこんな感じです。実際にはY軸を中心にグルグル回っていて、その中の1コマ。translateやscaleの数値を適当にいじって、とりあえず表示ができました。

プログラムの実行結果の1コマ

同じくGLOBAL SITEで配布されているモーションデータも、GitHubで公開されているサンプルコードを使って表示したことがあるんですが、そこから自分で変化をつけられるようになると、もっと楽しくなるんだろうなと思います。

参考

Processingをはじめよう (Make: PROJECTS)

Processingをはじめよう (Make: PROJECTS)