頭と尻尾はくれてやる!

パソコンおやじのiPhoneアプリ・サイト作成・運営日記


iOSでキューブマッピング

オフスクリーンレンダリングを調べていた時にキューブマッピングなるものを知ったんだわ。環境マッピングとも言ったりするみたい。
これを使えばオブジェクトへの映り込みを表現できるとか。これは面白そうだと挑戦してみたんだよ。

ところがこれ、やろうとするとなかなかややこしくてね。OpenGLだとよくあることだけど説明する人によって環境も違うしさ。iOSでのOpenGLだとどうなるんだろう?と最初は戸惑ったんだけど、結局のところ、このキューブマッピングというのはオブジェクトを’世界’の中心に置いて視線と法線だけで周辺画像(上下左右前後6枚用意するでしょ)のどこを拾うかを決定するんだよね(周辺は無限遠にあると仮定するので)。

するとフラグメントシェーダはこんなのになる。
{
    highp vec3 ref = reflect(vPosition - eyePosition, vNormal);
    gl_FragColor = textureCube(uTexture, ref);
}
これだけで物体表面のテクスチャに周辺の画像(6枚の画像)が映り込む。単にテクスチャの表示方法を指定してるだけで、オフスクリーンレンダリングも必要なし。
ちょっとこれすごくない?

実際にやってみたところ、、、

キューブマッピングの結果

↑こんな感じになる。
このトーラス、頂点の数が221,184個あるんだわ、、、もっとキレイに映り込みさせようとするならどんなけ必要なんだよー?!って感じ。
iPhone 5sだと60fps出てたけど、touch(5G)だと35fps程度。静止画ならともかくリアルタイムで動かそうとするならちょっと使いどころが難しいかな。

wgld.org | WebGL: キューブ環境マッピング |
↑なお、6枚のテクスチャはここから借りたよ。

<< その手は桑名の蒸しはまぐり  TopPage  Blenderで穴を開けるのはBooleanのDifference >>

コメント


管理者にだけ表示を許可する
 

トラックバック

トラックバックURL
http://ringsbell.blog117.fc2.com/tb.php/912-78067e08




Copyright ©頭と尻尾はくれてやる!. Powered by FC2 Blog. Template by eriraha.

FC2Ad