レンダラー
renderer システムは シーンの中の
THREE.WebGLRenderer (opens new window) インスタンスを設定します。
これはWebVR/WebXRに入ったときにpresentationアトリビュートを設定します。
# 例
<a-scene renderer="antialias: true;
colorManagement: true;
sortObjects: true;
physicallyCorrectLights: true;
maxCanvasWidth: 1920;
maxCanvasHeight: 1920;"></a-scene>
# プロパティ
| Property | Description | Default Value |
|---|---|---|
| antialias | アンチエイリアスを行うかどうか。autoの場合、モバイルではアンチエイリアスは無効となります。 | auto |
| colorManagement | カラーマネジメントされたリニアワークフローを使用するかどうか。 | false |
| highRefreshRate | Oculusブラウザで72hzモードをトグルします。デフォルトは 60hz です。 | false |
| foveationLevel | VRでfoveationを有効にし、パフォーマンスを向上させる。0 なし、1 低、2 中、3 高 0 | 0 |
| sortObjects | レンダリング前にオブジェクトをソートするかどうか。 | false |
| physicallyCorrectLights | 物理的に正しい光の減衰を使用するかどうか。 | false |
| maxCanvasWidth | キャンバスの最大幅。デバイスのピクセル比を乗じたサイズを使用します。-1に設定するとキャンバスの幅を制限しません。 | 1920 |
| maxCanvasHeight | キャンバスの高さの最大値。maxCanvasWidth と同じ挙動になります。 | 1920 |
| logarithmicDepthBuffer | 対数深度バッファを使用するかどうか。 | auto |
| precision | フラグメントシェーダーの精度：低、中、高。 | high |
| alpha | キャンバスにアルファバッファを含めるかどうか。 | true |
注: シーンが初期化されると、これらのプロパティを変更することはできません。
# アンチエイリアス
この機能を有効にすると、曲線や対角線のエッジのギザギザが滑らかになり、適度なパフォーマンスコストがかかります。デフォルトでは、モバイルデバイスのアンチエイリアシングは無効になっています。
# カラーマネジメント
カラーマネージメントにより、より正確なレンダリングが可能になり、オーバーライトや "ウォッシュアウト "といった現象の可能性が低くなります。カラーマネジメントを有効にすることは、テクスチャリングやモデリングツールの色を正確に合わせるために推奨されますが、現時点では非公式のコンポーネントがカラーマネジメントに適切に対応するとは限りません。
マネージドカラーモードとアンマネージドカラーモードは、それぞれ他のエンジンやツールにおけるリニアとガンマのワークフローと同様です。
NOTE: three.js、およびA-Frameの以前のバージョンでは、
gammaOutput: trueプロパティが 利用可能でした。これは、カラーマネジメントが有効な場合に自動的に適用されます。
# リフレッシュレート
指定されたデバイスの最高のリフレッシュレートをトグルします。現在、これは Oculus Go の Oculusブラウザでサポートされており、60hz から 72hz へのレンダリングを切り替えます。
# フォーヴィエーションレベル（陥凹形成レベル）
特定のシステムでステレオレンダリングモードの場合に、ビューポートの端のピクセルを少なくしてレンダリングする、フォーベーションのレベルを設定します。これは現在、 Oculus Go 上の Oculus Browser でサポートされており、0（なし）から3（高）の範囲の値で設定します。
# オブジェクトの並べ替え
並べ替えは、ある程度の透明度を持つオブジェクトを適切にレンダリングするために使用されます。様々な制限のため、適切な透明度を得るには、しばしばある程度の慎重な設定が必要です。デフォルトでは、オブジェクトはソートされず、DOM の要素の順序によってレンダリングの順序が決定されます。DOM 要素の順序を変更することで、一貫した動作を強制することができますが、 renderer="sortObjects: true" を使用すると、カメラが移動したときに望ましくない変更が発生する可能性があります。
# 物理的に正しい照明
デフォルトでは、ポイントライトとスポットライトは、歴史的には一般的ですが、物理的には不正確なモデルに従って減衰（または、遠ざかるにつれて暗く表示されます）します。より現実的な減光を行うには、 renderer="physicallyCorrectLights: true"と設定します。この変更を行う場合、光の強さを調整する必要がある場合があります。どちらのモードでも、パフォーマンスに大きな影響はありません。
注: glTFモデルにライトが含まれている場合、物理的に正しいライティングモードを使用して、 元のモデリングツールの結果と一致させます。
# 対数深度バッファ
対数深度バッファは、スケールと距離の非常に大きな差を含むシーンで、より良いソートとレンダリングを提供することができるかもしれません。
# 精度
フラグメントシェーダーの精度を設定します。主な用途は、古いハードウェアやドライバの問題に対処することです。特にAdreno 300シリーズのGPUを搭載した機種は問題があります (opens new window)。回避策として、mediumpに設定することができます。これは特にモバイルでのパフォーマンスを向上させますが、シェーダやテクスチャにビジュアルアーチファクトを引き起こす可能性があることに注意してください。
# アルファ
キャンバスにアルファバッファを含めるかどうかを設定できます。これが true の場合、レンダラーは透明なバックバッファを持ち、キャンバスはウェブページの残りの部分と合成することができます。詳しくはこちらをご覧ください (opens new window)。