Unity&Shader案例篇—地图上热图分布

一、介绍

在2维平面地图上随机或者指定位置生成一系列的热量、能源或者其他需要表示的信息的分布图。可以通过切换不同的贴图表示不同的信息，如图所示表示的是该地区的降水量的变化

如图所示为表示该地区的温度变化分布图

二、实现

在贴图的的某个位置处绘制指定半径的圆圈，然后调整圆圈的强度也即透明度。因此Shader部分会定义这两类变量，因为Shader里面不能定义没有长度的数组，只能一开始给个固定比较大的100作为初始长度，在代码里传这个数组变量的时候只要不超过这个数组的长度的参数都是可以的。当然你穿了101个数组的参数也不会报错，但是超出100的肯定也不会被shader代码使用到

			//自定义变量
			uniform int _Points_Length = 0;
			uniform float3 _Points[100];		// (x, y, z) = 位置
			uniform float2 _Properties[100];	// x = 半径, y = 透明度
			sampler2D _HeatTex;

然后，计算每个分布点位置相对世界坐标原地的距离，再结合强度就可以都到一个输出的透明度值。片段着色器代码为：

half4 frag(vertOutput output) : COLOR
			{
				half h = 0;
				for (int i = 0; i < _Points_Length; i++)
				{
					// 计算每一个分布点位置的距离
					half di = distance(output.worldPos, _Points[i].xyz);

					half ri = _Properties[i].x;
					half hi = 1 - saturate(di / ri);

					h += hi * _Properties[i].y;
				}

				
				h = saturate(h);
				half4 col = tex2D(_HeatTex, fixed2(h, 0.5));
				return col;
			}

接下来编写控制脚本，这里写了一个随机的位置、半径和强度。

  pointPoses = new Vector4[countPoint];
        pointProper = new Vector4[countPoint];

        for (int i = 0; i < pointPoses.Length; i++)
        {
            pointPoses[i] = new Vector2(Random.Range(-0.9f, 0.9f), Random.Range(-0.5f, 0.5f));
            pointProper[i] = new Vector2(Random.Range(0f, 0.25f), Random.Range(-0.25f, 1f)); // (Radius, Intensities)
        }

        heatMat.SetVectorArray("_Properties", pointProper);
        heatMat.SetInt("_Points_Length", countPoint);

最后要得到如上图所示的闪烁的热图效果，就是在已有的点位置上加一个噪声处理，如：

 for (int i = 0; i < countPoint; i++)
        {
            pointPoses[i] += new Vector4(Random.Range(-0.1f, +0.1f), Random.Range(-0.1f, +0.1f), 0f, 0f) * Time.deltaTime;
        }
        heatMat.SetVectorArray("_Points", pointPoses);

三、总结

1、通过处理不同强度的噪声变化也能得到一些区域着重显示的效果

2、完整工程点击打开链接

Unity&Shader案例篇—地图上热图分布

猜你喜欢