CocosCreator模拟实现点光源的效果
版本1.9.3
先上效果图
图片上传不了。只能引用知乎的图片了
https://pic2.zhimg.com/80/v2-2fa50c517253ac8391cae59a264da82d_hd.jpg
+和-按钮可以模拟光源的z高度来实现改变影子的长度
核心代码就是通过shader读取法线贴图的法线向量和点光源计算一个光照效果，
核心代码如下：
vec3 lightDir = normalize(vec3(lightPos - vec3(x, y, 0.0)));
//衰减系数
float F = 1.0 / (1.0 + dis * 0.0009 + dis * dis * 0.00001);
//得到法线贴图的法线数据
vec3 NormalMap = texture2D(CC_Texture0, v_texCoord).rgb;
//将法线贴图里的rgb数据转换成真正的法线数据，并归一化
vec3 normal = normalize(NormalMap * 2.0 - 1.0);
float diff = max(dot(normal, lightDir), 0.0) * lightDiffNum;
diffuseLight = diff * lightColor * F;
if (diff == 0.0 && texture2D(CC_Texture0, v_texCoord).a > 0.1)
{
return vec4(0.0, 0.0, 0.0, 1.0 - minNum);
}
return vec4(diffuseLight, 1.0);
新增加的遮罩检查效果：
https://pic3.zhimg.com/80/v2-80ca4617a8ec923f4a582042aa58700e_hd.jpg
https://pic3.zhimg.com/80/v2-5e2921d2826ca1f210f4c46f4121dd9a_hd.jpg
github地址：https://github.com/nhljh1234/MyProject/tree/master/2DLight
关于遮挡的解决：
1.把影子绘制在最下层
2.引入深度贴图绘制影子
不过由于缺少3D的数据遮挡不是很好解决，所以制作的时候可以尽量减少遮挡
可优化的选项：
1.把法线贴图合成一张，减少Draw Call
2.绘制一张地表的法线贴图来模拟阴影