FBXファイルの読み込み機能を作り始めた
FBXファイルの読み込み機能を作り始めた。次のページを参考にさせてもらっている。
今のところ、バイナリ形式のFBXファイルのパースだけはできた。まだメッシュを読み込んで画面に表示する機能は作っていない。
あと、DAEファイルのパーサを修正した。簡単なファイルであれば、メッシュにして画面に表示することはできた。ただ、昨日も書いたような感じで、DAEファイルもOBJファイルと同じように、頂点に紐づいていて欲しいデータがインデックス値の方に紐づいているようだった。もしかすると、その形式の方が3Dのメッシュデータの形式として一般的なのかもしれない。
・関連するコミット
add: fbx reader class · hikipuro/tea.js@94c43dc · GitHub
OBJファイルを画面に表示する機能を追加
プロジェクトビューからOBJファイルを画面に追加できるようにした。また、OBJファイル読み込み機能を使って複雑なメッシュを読み込んだ時に、UIスレッドが止まらないようにした。具体的には、OBJファイルの各行を文字列として読み込むメソッドの実行時に、引数で指定した行数を読み込む度にsetTimeoutで待ち時間を入れるようにした。こうすることで、UIスレッドが停止してしまう問題を解消できる。この構造を使う場合はメソッドの実行完了を通知するために、引数でコールバック関数を一緒に指定する必要が出てくる。
今のところOBJファイルのフォーマットで気になることがある。WebGLのシェーダでは頂点情報に紐づける形で、法線、テクスチャ座標等の追加の情報を持つ構造になっている。頂点ごとに紐づいた情報のかたまりが、それぞれ1つずつ頂点シェーダに渡されるような仕組みになっている。しかしOBJファイルのフォーマットでは、法線、テクスチャ座標等の情報を紐づける先が頂点ではなく、インデックス値になっている。この情報の持ち方を考慮せずに、インデックス値に紐づいた2つ目以降の情報を雑に削ってしまっても、多くの場合、破綻なく画面に表示されるようだ。ただ、今のところの実装では、UnityのOBJファイルのインポート後のメッシュデータと見比べると差がある。うまく違いを吸収するにはどうしたら良いかという部分で悩みがある。
・関連するコミット
add: obj file to scene feature · hikipuro/tea.js@3e166ee · GitHub
ファイルのインスペクタを修正した
今まではテキストファイルだけインスペクタに表示していたけど、画像ファイルのインスペクタを追加した。フォルダやその他のファイルもとりあえず概要だけ表示するようにした。
・関連するコミット
add: image file inspector · hikipuro/tea.js@9cffb23 · GitHub
プロジェクトビューの修正
プロジェクトビューの機能をいくつか修正した。また、インスペクタビューも少し修正した。
・ファイルリストのコンテキストメニューにCreate等を追加
・リネーム後にファイルを並び替えるように修正
・並び替えの順番が名前順になっていない問題を修正
・インスペクタビューでコンポーネントを上下に入れ替える機能を追加
・インスペクタビューの値をリアルタイムに更新する機能を編集時は停止するように修正
プロジェクトビューでファイルをドラッグできるようにした
プロジェクトビューで、ファイルを別のフォルダへドラッグできるようにした。当たり前のようにある機能を実装しただけだけど、いろんな場所の違ったUI要素にドラッグできるようにするのは、思いのほか作る手間がかかった。
プロジェクトビュー関連での今後の修正点としては、JavaScriptファイル等の画面上のオブジェクトにアタッチ可能なファイル以外のものをヒエラルキービューにドラッグできなくしたり、画面上のオブジェクトに関連付けられたファイルの、ファイル名やパスが変更された時に参照先を変えたりとか、その辺りの機能を追加する必要がある。
・関連するコミット
add: file drag feature to project view · hikipuro/tea.js@1b3ea8b · GitHub