頂点シェーダとフラグメントシェーダを別ファイルで管理したほうがよい 頂点シェーダとフラグメントシェーダを<script>タグ内に書く例をよく見かけますが、 あれは初心者向けの例であり、あまりよくないと思います。(プログラムを公開している人は勿論分かっている。…

はじめに GPU Gem3 - 8.4 Variance Shadow Mapsで、シャドウマップのモーメントを計算している箇所があるんですが、 そこを行間を補って丁寧に解説するという記事です。 実際のアルゴリズム 頂点シェーダで深度値(光源から見た時のZ値)を計算しoutします。 …

はじめに 本記事はあまり自信ありません。 ですが、少し効果が出たので記事化することにします。 バリアンスシャドウマップとは 普通のシャドウマップは「光が当たる」か「影になる」かの二択でしたが、 そうではなく、「影になる確率」を求めちゃおうという…

名称について この技法は「シャドウマップ法」、「デプスシャドウマップ法」、「デプスシャドウ法」と呼ばれたりすることもあります。 「シャドウマップ」とは、Z値を記憶しているテクスチャのことです。 アルゴリズム 1. シーンを光源から光が遮蔽されるま…

はじめに 配列の要素をコピーする関数を作成します。 やりたいことを以下のような感じです。 const r = f([1, 2, 3], 3); console.log(r); // [1, 2, 3, 1, 2, 3, 1, 2, 3] 実装 なんとなく以下のような実装にしました。 const f = (a, n) => (new Array(n).…