GINPRO / SQLの窓と銀プログラマ

これは、マウスホイールで Three.js で動作している背景の炎の遠ざけたものですが、もう少し遠ざけると反転して近づいて来ます。

▼ 表示した直後はこんな感じです。
(ビデオカードが OpenGL 2.0 をサポートしていて、Google Chrome か Firefox なら動作するはずです。)


このコードはもともと、平面画像をパノラマで360度回転させながら、中央でオブジェクトに周りの景色を映りこませるものですが、ここでは単純な以下のような背景を使用しています。



実際の Three.js のデモではこのような背景を使用しており、特別なものを作成する必要がありますが、



イラストのエフェクトとして使う目的であれば、形が固定では無い流体や気体であれば適当に並べるだけで目的を達成する事ができます。

中央で景色が映りこんでいる球体は、背景によって趣が変わりますが、このように一色の上になんらかの物体を置くと、球体に映りこんだ結果をブラシにする事もできます( 背景が真っ黒のところまで持って行って切り取って使う )








これは、所有しているブラシを再度組み合わせてリアルタイムに変形させて作り直せるという事も意味します。

Three.js としての 背景画像は、スケールを -1 とする事で若干歪むようになっており( 仕様は不明 )、エフェクトにはもってこいです。もともと、は背景は球形であり、楕円形の特殊な背景も可能であり、手前の球にも同じ事が言えます。

コードは、最低限のコードで整えましたので、リンク先の WEB ページのソースを見ていただくといいと思います。

切り取った球形炎を他の画像に使ったもの