Skip to content

Instantly share code, notes, and snippets.

@gyohk
Last active August 21, 2022 02:30
Show Gist options
  • Save gyohk/89f274082553c58722cc6b1352a047d7 to your computer and use it in GitHub Desktop.
Save gyohk/89f274082553c58722cc6b1352a047d7 to your computer and use it in GitHub Desktop.
* 平行光源の光の強さは、光源の方向のみに依存するので、各頂点の明るさは、法線 n と、光源の方向 l の内積(の関数)になります。
* 反射光の光の強さは、ライトベクトルと視線への反射ベクトルのハーフベクトルと面法線の内積で計算します。
* 環境光は計算量が多いので、単に色を乗せるだけで済ませます。
※ライトベクトルおよび視線の反射ベクトルは、モデルの回転に対する逆行列を掛けることで正しく表示されます。
ライトが固定して、ポリゴンが回る=ポリゴンを固定して、ライトを逆方向に回す
```
<script id="vs" type="x-shader/x-vertex">
attribute vec3 position; // 頂点属性:頂点座標位置
attribute vec3 normal; // 頂点属性:頂点法線
attribute vec4 color; // 頂点属性:頂点色
uniform mat4 mvpMatrix; // MVPマトリックス
varying vec3 vNormal; // フラグメントシェーダへ法線を渡す
varying vec4 vColor; // フラグメントシェーダへ色を渡す
void main(){
vNormal = normal;
vColor = color;
gl_Position = mvpMatrix * vec4(position, 1.0);
}
</script>
<script id="fs" type="x-shader/x-fragment">
precision mediump float;
uniform mat4 invMatrix; // inverseマトリックス
uniform vec3 lightDirection; // 平行光源の向き
uniform vec3 eyePosition; // カメラの位置
uniform vec3 centerPoint; // カメラの注視点
uniform vec4 ambientColor; // 環境光の色
varying vec3 vNormal;
varying vec4 vColor;
void main(){
// カメラの位置と注視点を用いて視線を算出
vec3 eyeDirection = (-1.0 * eyePosition - centerPoint);
// 視線ベクトルを逆行列で修正
vec3 invEye = normalize(invMatrix * vec4(eyeDirection, 1.0)).xyz;
// ライトベクトルを逆行列で修正
vec3 invLight = normalize(invMatrix * vec4(lightDirection, 1.0)).xyz;
// ハーフベクトルを算出
vec3 halfVector = normalize(invLight + invEye);
// 拡散光の強度を算出
float diff = clamp(dot(invLight, vNormal), 0.1, 1.0);
// 反射光の強度を算出
float spec = pow(clamp(dot(halfVector, vNormal), 0.0, 1.0), 20.0);
// 最終出力カラー
vec3 dest = vColor.rgb * diff + spec + ambientColor.rgb;
gl_FragColor = vec4(dest, vColor.a);
}
</script>
```
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment