イナヅマTVログ

WebGL Inspector

Chrome extension, WebGL Inspectorが超便利

| 0件のコメント

Canvas, WebGL開発で困るのがデバッグ。
HTML, CSSみたいに開発ツールで状態を確認することもできず、Canvas内がブラックボックスになること。
何がなんでどうなってるのか検討もつかない。

WebGL Inspector

Chrome 拡張機能 WebGL Inspector を追加すると明るい未来が開けます。
WebGL Inspector

WebGL Inspector by benvanik

Chrome ウェブストア: WebGL Inspector

拡張機能を追加し有効にするとWebGL を使用していると画面右上に[Capture][UI]と表示されます。
[UI]を押すと画面下側にパネルが開きます。
これで様々状態を知ることができます。
アニメーションを遅くしたり、一時停止したりが可能です。

[Capture]を押すとその時点のスナップショットがとれます。

Githubでソースコードが公開されています。
今も頻繁に更新されているようです。
github: benvanik / WebGL-Inspector

助かります、感謝!

コメントを残す

必須欄は * がついています