OpenGL在frag着色器中模擬點光源

在3D世界中,模擬點光源實現對牆壁的光照。效果還是非常不錯的。
思路如下:

  1. 準備一張牆壁圖像。
  2. 自動生成牆壁的法線紋理。
  3. 模擬點光源。
  4. 添加漫反射。
  5. 隨着時間變換進行規律性移動。

代碼如下:

#iChannel0"file://./wall.jpeg"

float getVal(vec2 uv)
{
    return length(texture(iChannel0,uv).xyz);
}

vec2 getGrad(vec2 uv,float delta)
{
    vec2 d=vec2(delta,0);
    return vec2(
        getVal(uv+d.xy)-getVal(uv-d.xy),
        getVal(uv+d.yx)-getVal(uv-d.yx)
    )/delta;
}

// 隨着時間流逝,來模擬點光源動態移動
float msin()
{
	// 因爲sin把區間固定在[-1, 1],1.0是範圍因子,0.5將改變sin函數的中點位置,不懂就畫圖。
    return sin(iTime)*1.0 + 0.5;
}

void mainImage( out vec4 fragColor, in vec2 fragCoord)
{
	vec2 uv = fragCoord.xy / iResolution.xy;
	// 獲取法線貼圖
    vec3 n = vec3(getGrad(uv, 1.0/iResolution.y), 150.0);
    n = normalize(n);
    // 設計一個點光源p, 座標在(0.5, 0.5)中心位置, 由於uv紋理是[0.0, 1.0]範圍的
    vec2 p = vec2(msin(), 0.5);
    // 計算uv和p的距離
    vec2 d = p-uv;
    // 光源方向,0.125是z向量,從2維到3維
    vec3 ligthDir = vec3(d, 0.125);
    // 計算光照在uv像素上面的強度, 因爲越近的應該越強, 所以使用除法.length計算的是長度
    float q = 0.4/length(ligthDir.xyz);
    // 光源顏色
    vec3 ligthColor = vec3(0.9922, 0.4667, 0.1137);
    // 光源顏色*漫反射*光源強度
    vec3 diffuse = ligthColor * max(dot(n, normalize(ligthDir)), 0.0) * q;
    // 紋理貼圖
    vec4 color = texture(iChannel0, uv);
    fragColor = vec4(diffuse * color.rgb, 1.0) + 0.1;
}

原圖如下:
在這裏插入圖片描述
效果如下:
效果鏈接

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章