threejs-parallax-occlusion-mapping

パララックスオクルージョンマッピング

起伏を、交差判定、カバレッジ、法線、シャドウが連携するシステムとして扱います。 テクスチャ座標のオフセットだけで終わらせないでください。

このスキルには、説明的なガイダンスに加えて、優れたサンプルやアセットが含まれています。参考にしたり、参照したり、場合によってはコピーしたりする価値があります。該当する場合は十分に活用し、むやみに読み飛ばさないでください。

構築の順序

tangent frame and height convention
  -> view-ray march and hit refinement
  -> bounded or curved silhouette coverage
  -> shared marched sampling
  -> height-derived shading normal
  -> light-ray self-shadow march
  -> relief-aware cast/received shadow positions

交差判定の契約、平面および曲面のシルエットモード、シェルの膨張、シャドウの統合、品質制御、診断については、references/silhouette-relief-contract.mdをお読みください。

TSLによる完全なマーチング、ヒット位置の二分探索による精密化、勾配に安全なサンプリング、カバレッジ、ホライズンのトリミング、曲面のたわみ、セルフシャドウ関数については、シルエット起伏の実装をお読みください。

高さから導出した法線、膨張した円柱シェル、アルファ・トゥ・カバレッジ、シャドウマスクの切り抜き、マーチングしたシャドウ深度、シャドウを受ける位置を使って壁、デッキ、起伏のある柱、頭上のパイプを構成する方法については、完全な隔壁アセンブリとそのパック済みプロシージャル高さマップをお読みください。

必須の制御項目

• ワールド空間または UV 空間での起伏スケール；
• ビューマーチングレイヤーの最小値と最大値；
• シルエットの境界とフェザリング；
• 曲面の曲率、または曲率コールバック；
• ホライズンのトリミングとエッジの侵食；
• セルフシャドウのステップ数、バイアス、強度；
• ジオメトリ、切り抜き、完全な起伏の各シャドウモード；
• 高さ、カバレッジ、マーチング後の UV、法線、シャドウの各診断。

失敗条件

• 色、法線、粗さの再構築で、意図せず個別のビューマーチングが実行される；
• 曲面のホストで、幾何学的なホライズンに平面用のシルエットクリッピングを使用する；
• 膨張したシェルによって、起伏の底面がベース面上に保たれず、位置が変わる；
• アルファテストによるビューティーカバレッジで、シャドウマップも自動的に切り抜かれると想定する；
• カバレッジが侵食されるドライバーで、discardの後に微分を使ったサンプリングを行う；
• かすめるような光線で、上限のないビュー空間 Z 成分を除算に使う；
• 起伏のセルフシャドウで、フィルやエミッションまで一律に暗くする。

適用範囲

レイマーチングによる高さ交差判定もシルエットの制御も必要ない場合は、$threejs-procedural-materialsを使用してください。シルエットをビュー依存の起伏ではなく、実際のメッシュトポロジーにする必要がある場合は、$threejs-procedural-geometryを使用してください。