WebGL ビルドのデバッグとトラブルシューティング
WebGL のネットワーク

WebGL グラフィックス

WebGL is an API for rendering graphics in web browsers, which is based on the functionality of the OpenGL ES graphics library. WebGL 1.0 roughly matches OpenGL ES 2.0 functionality, and WebGL 2.0 roughly matches OpenGL ES 3.0 functionality.

Deferred Rendering

Unity WebGL only supports Deferred Rendering Path if WebGL2.0 is available. On WebGL1.0, Unity WebGL runtime will fallback to Forward Rendering.

グローバルイルミネーション

Unity WebGL は Baked GI のみをサポートしています。 Realtime GI は WebGL では今のところサポートされていません。なお、Non-Directional ライトマップのみがサポートされています。

プロシージャルマテリアル

Unity WebGL は実行時の プロシージャルマテリアル をサポートしていません。ほかのサポートされていないプラットフォームと同様にプロシージャルマテリアルはビルド中に通常のマテリアルにベイクされます。

リニアレンダリング

Unity WebGL only supports linear color space rendering with WebGL 2.0. Linear color space rendering doesn’t have fallback support for WebGL 1.0. To build a WebGL player using linear color space rendering, you need to remove WebGL 1.0 API in Player Settings > Other Settings; uncheck Automatic Graphics API.

Some web browsers don’t support sRGB DXT texture compression. This can decrease the quality of rendering performance when using linear rendering, due to runtime decompression of all the DXT textures.

MovieTexture

WebGL は MovieTexture クラスを用いた動画再生をサポートしていません。しかし、HTML5 video 要素を用いて WebGL コンテンツで効率よく動画を再生することはできます。実践例については、こちらの Asset Store パッケージ をダウンロードしてください。

WebGL シェーダーコードの制限

WebGL 1.0 の仕様により、GLSLS シェーダーコードは OpenGL ES 2.0 で実装できますが多くの制限があります。これは自作シェーダーを書く場合に最も関係してくることです。

特に WebGL は配列や行列のインデックス化に使用できる値に関して制限を受けます。具体的には、WebGL は定数式に動的インデックス、ループインデックスやそれらの組み合わせのみ可能です。頂点シェーダーの Uniform アクセスだけは例外で、すべての表現を用いてインデックスできます。

管理構造にも制限が課されます。ループの種類中使用できるのはイニシャライザーが変数を定数に初期化する場合、定数に変更が加えられた場合、変数から定数を引いた場合、継続テストが変数を定数と比べた場合の for ループのカウントのみです。この条件と合致しない for ループと while ループは使用できません。

フォントレンダリング

Unity WebGL は他すべての Unity プラットフォームのようにダイナミックフォントレンダリングをサポートしています。しかし、ユーザーのマシンにインストールされているフォントにアクセスすることはできないため、使用されるすべてのフォントは(代替できるよう、多国に対応するフォントや太字・イタリックバージョンのフォントも含めて)プロジェクトフォルダーに配置し、予備フォント名を設定しましょう

Anti-Aliasing

WebGL supports anti-aliasing on most (but not on all) combinations of browsers and GPUs. To use it, anti-aliasing must be enabled in the default Quality Setting for the WebGL platform.

Note that on WebGL1.0 there are several limitations:

  • Switching quality settings at runtime will not enable or disable anti-aliasing - it has to be set up in the default Quality Setting loaded at player start up.

  • The different multi sampling levels (2x, 4x, etc..) have no effect in WebGL, it’s either on or off.

  • Any post-processing effect applied to the camera disables the built-in Anti-Aliasing.

  • HDR is not compatible with anti-aliasing so make sure “Allow HDR” camera option is disabled.

There are no such limitations on WebGL2.0.

リフレクションプローブ

リフレクションプローブは WebGL でサポートされています。しかし、特定のミップマップへレンダリングする WebGL 仕様の制限により、滑らかなリアルタイムのリフレクションプローブはサポートされません (そのため、リアルタイムのリフレクションプローブは常に鋭いリフレクションを生成し、とても解像度が低く見えます。)。滑らかなリアルタイムのリフレクションプローブには WebGL 2.0 が必要です。

WebGL 2.0 のサポート

Unity includes support for the WebGL 2.0 API, which brings OpenGL ES 3.0-level rendering capabilities to the web.

By default, Unity WebGL builds support both WebGL 1.0 and WebGL 2.0 APIs, This can be configured in the WebGL Player Settings > Other Settings; to do this, uncheck Automatic Graphics API.

When WebGL 2.0 is supported in browsers, content can benefit from a better quality in the Standard Shader, GPU Instancing support, directional lightmap support, no restrictions on indexing and loops in shader code, and better performance.


  • 2017–06–19 限られた 編集レビュー で修正されたページ

  • Linear rendering for WebGL 2.0 added in 2017.2 NewIn20172

WebGL ビルドのデバッグとトラブルシューティング
WebGL のネットワーク