mieki256's diary

DXRubyを使って、2Dで一本道を生成するのはソレっぽくできたので、今度は Processing を使って3Dで一本道を生成してみたり。環境は Windows10 x64 + Processing 3.0.2。

_sketch_roadmake1 (Processing.js版)

ソース : _sketch_roadmake1.pde
使用画像 : _road_tex.png
Windows版の実行バイナリも含めた一式 : _sketch_roadmake1_20160317.zip (72.4MB)

License は CC0 / PublicDomain ってことで。

気になる点をメモ。

• そのままではテクスチャが歪むかなと思ったけど、意外と気にならない結果に。横に長いポリゴンを置いてるせいかもしれない。
• Processing.js (JavaScript) で動かすと、テクスチャがボケボケになる。なんでや。ブラウザによって見え方が違うのかと思って、Firefox、GoogleChrome で試してみたけど、やっぱりボケボケ。Java版で動かすとクッキリしてるのだけどなあ…。謎。
• 高さも変化するようにしてみたけど、ところどころガクガクしちゃってる。一応、イージングを使って多少は緩和してみたつもりだったのだけど、効果が出てないような。自分の書いたソースにバグがあるのかもしれず。それとも、スプライン補間等を使わないとダメかな。
• 道路片の裏が見えてる時は非表示にしたい。ポリゴンの法線ベクトルと視線ベクトルの内積で、とかやるんだっけ？ どうだったかな。
• translate() と rotate?() で動かせないかと試したけれど上手くいかず、結局 camera() を設定して動かしてしまった。

さておき、道路脇の地面、ビルボードの樹木、背景等を入れれば、もう少しそれっぽくなりそうかなと。そのためには、道路のポリゴンだけではなく、地面やビルボードのポリゴン座標もデータとして持たせないと。データの持ち方・作り方を変更しないといかんなと。

ググっていたら、Processing なら透視変換行列を加工してビルボードができるけど、Processing.js では行列を取り出す命令が実装されてないから無理、という話を見かけた。なかなか厳しい。

◎ Processingのスクリーンショットについて。 :