Stage3Dをワイヤーフレーム表示する

小ネタです。

ワイヤーフレームモード

あまり知られていませんが、Stage3Dにはポリゴンを塗りつぶして表示するだけでなく、ワイヤーフレーム表示する機能があり、これを使うことで重なりなった複雑な3Dモデルの状況確認や、メッシュの分割形状の確認など、デバッグなどに活用することができます。

Starling2.0のCanvasクラスで描画したサークル(左)をワイヤーフレーム表示すると右のようになります。このようにポリゴン分割されているんですね。

コードも簡単です。Starlingでの例を下に書きます。（Stage3Dの機能なので、Starlingを使っていなくても利用できます。）

sample.as

// 現在のStarlingからContext3Dを取得する
var context:Context3D = Starling.current.context;
// ワイヤーフレーム表示にする
context.setFillMode(Context3DFillMode.WIREFRAME);
// ワイヤーフレーム表示をやめて元に戻す
context.setFillMode(Context3DFillMode.SOLID);

初期化時だけでなく、動作中に表示を交互に切り替えることも可能です。

別の表示例を示すと、以前投稿したマップ表示は

下記のようになります。

タイル状にマップチップを並べているのがよくわかります。ワイヤー表示となった線の部分でもテクスチャのサンプリングは行われるようですね。

制限事項

この機能ですが、実はモバイルで使用することができません。とはいえ、自分の場合、開発デバッグ以外でこの機能を使うことはなさそうですし、モバイルのコンテンツ開発もMac上で行っています。(DesktopのAIRアプリとして開発して、モバイルはコア部分のソースを共有して別プロジェクトで最後にビルドする。ANEは適当なインターフェースでラップして抽象化した状態で使いDesktop側プロジェクトでコンパイルエラーがでないようにする。）利用する際に制限が問題になることはなさそうです。

また、DesktopにもレンダリングのプロファイルがBASELINE設定以上という制限がありますが、こちらは今時のマシンで問題になる事はさらにないでしょう。

以上、知られていなそうなので記事にしてみました。情報は、こちらの記事を参考にしました。
Stage3D Wireframe Mode Support