VRML導入の経緯
お仕事の都合で、なるべくさくっと「3Dオブジェクトが指定通りに動く」ような表示をしなければならなくなった。
OpenGL使えばできるのは知ってるけど環境整えるの面倒だな……と思ったところで、以前大学院の先輩がVRMLを自分のwebページに貼っていたのを思い出す。
ということで試してみたので忘備録として。
VRMLってなんだっけ
今更書くのもなんなので、わかりやすかったサイトをリンク。
VRML(法政大学)
VRML実習マニュアル(pdf)
VRMLプログラムの基本例題(pdf, 東海大学)
VRMLサンプルページ(静岡大学三浦研究室)
バーチャルリアリティ(pdf, 和歌山大学)
ライブラリ解説
VRMLbyHAND
VRML索引(浜松大学長粼ゼミ)
VRML自体はもうずいぶん昔からの技術で、X3Dという新しい言語も策定されているので、そっちを使えばいいのに……という声が聞こえてきそうだが、web上に落ちている日本語の説明文の潤沢さから今回はVRMLにした。なにせ今回のコンセプトは「なるべくさくっと」なのでね。 *1
VRMLの実行環境をインストール
どれにしようか(1)
ビューワやプラグインは色々出ているので何にしたらいいのか迷うところ。
参考にしたサイトはここ。
とりあえずFreeWRLをインストール
まずはFreeWRLを試してみた。
英語サイト:http://freewrl.sourceforge.net/
日本語サイト:http://sourceforge.jp/projects/sfnet_freewrl/
FreeWRL起動のしかた
http://www.k.hosei.ac.jp/~sawa/lecture/vrml_nt/index.html
のサンプルを表示させようとするも、firefoxのプラグインとしては動作しない。
仕方がないのでサンプルファイルをダウンロードして、直接起動。
- コマンドプロンプトでFreeWRLのインストールフォルダに移動
- FreeWRL.exe [ファイル名(フルパス)]
FreeWRL操作のしかた
- 左ドラッグ:図形(空間?)の回転
- 右ドラッグ:下でズームイン、上でズームアウト
サンプル見ながら試行錯誤
オブジェクトを置くだけだったらなんか簡単そうな予感。
今回はjointを持たないオブジェクトを複数、空間中にばらばらっと表示すればよいので、joint周りもあまり面倒くさくない。
問題は、これを時系列的に動かすところだよなー。
使ってみよう
意外なる落とし穴
サンプルに従い
#VRML V2.0 utf8
という書き出しでファイルを作ったのだが、
deciphering loaded file, unknown file type encountered.
とか表示されてうまく動かない。
ダウンロードしたファイルをみたらsjisだったので、試しにShift-JISで保存したらうまく動くという。
utf8じゃないじゃん……
座標原点の表示
とりあえずboxを3つ使って、座標原点を表示できるwrlを作成。
本当は矢印とかxyzって文字とか加えたいけど、それはまぁおいおい。
#VRML V2.0 utf8 #座標原点 filename=coord.wrl Transform { translation 0 0 0 children[ Transform { translation 0.5 0 0 children[ Shape { appearance Appearance{ material Material{ diffuseColor 1 0 0 } } geometry Box{ size 1 0.1 0.1 } } ] } Transform { translation 0 0.5 0 children[ Shape { appearance Appearance{ material Material{ diffuseColor 0 1 0 } } geometry Box{ size 0.1 1 0.1 } } ] } Transform { translation 0 0 0.5 children[ Shape { appearance Appearance{ material Material{ diffuseColor 0 0 1 } } geometry Box{ size 0.1 0.1 1 } } ] } ] }
オブジェクトを表示して、時間軸に沿って移動・回転させてみる
- TimeSensorで「世界の時間管理人」を作る
- OrientationInterpolator, PositionInterpolatorで「時間に対する角度・位置の指定(適宜補間)」
- そうやって求めた値をオブジェクトの位置・角度の指定として与える、というROUTEで繰り返し
Interpolatorには色変えも存在するらしい。
回転の順番が良くわからないので要調査。
#VRML V2.0 utf8 #オブジェクトが移動する例 DEF RUde Transform { children [ Transform { translation 0 0 0 children[ Shape { appearance Appearance { material Material { diffuseColor 1 0 0 } } geometry Sphere { radius 0.1 } } ] } Transform { translation 0 5.1 0 children[ Shape { appearance Appearance { material Material { diffuseColor 0.7 0.5 0 } } geometry Cylinder { height 10 radius 3 } } ] } ] } DEF Gtime TimeSensor { cycleInterval 1.0 loop TRUE } DEF Grotation OrientationInterpolator { key [ 0, .1, .2, .3, .4, .5, .6, .7, .8, .9, 1.0 ] keyValue [ 1 0 0 0, 1 0 0 1, 1 0 0 2, 1 0 0 3, 1 0 0 4, 1 0 0 5, 1 0 0 6, 1 0 0 7, 1 0 0 8, 1 0 0 9, 1 0 0 10 ] } DEF Gposition PositionInterpolator { key [ 0, .1, .2, .3, .4, .5, .6, .7, .8, .9, 1.0 ] keyValue [ 0 1 0 , 0 2 0 , 0 3 0 , 0 4 0 , 0 5 0 , 0 6 0 , 0 7 0 , 0 8 0 , 0 9 0 , 0 10 0 , 0 11 0 ] } ROUTE Gtime.fraction_changed TO Grotation.set_fraction ROUTE Gtime.fraction_changed TO Gposition.set_fraction ROUTE Grotation.value_changed TO RUde.rotation ROUTE Gposition.value_changed TO RUde.translation
とりあえず今日のところはここまで。
次回は人体1人分を通しで作りたいところ。
その他、便利な・ためになるリンク集
JavaScriptと連動もできるらしい(2013/2/4追記)
VRMLに予め規定した動作しかできないのかなーと思いきや、JavaScriptと連動もできるらしい。もちろんX3Dにも同様の機能がある模様。
VRML with JavaScript Tutorial ( VRML + JavaScript チュートリアル )
ただし今回は「なるべくさく(ry」なので、まずは使わずに進んでみる。*2