Unity Shader 熔岩Lava（2D）

本篇主要技術點有：
1. Noise的應用
2. FBM的基本應用
3. 顏色空間映射

1.實現流程

1.單層noise分佈

2.多層疊加，每層noise添加位移和旋轉

3.色溫映射

2.實現

1.基本形態：

1.通過FBM構造基本形態，在FBM添加點變化

1.每一層的移動速度不一樣
2.每層的旋轉不一樣

2.FBM的其他的應用還有

1.動態霧的密度
2.雲層的密度
3.地形高程圖
4.大理石紋理
5.3D動態雲(fake)的實現原理和這裏類似.不過沒有添加旋轉

float _Noise( in float2 x ){ return VNoise(x*0.75);}

float2 Gradn(float2 p)
{
    float ep = .09;
    float gradx = _Noise(float2(p.x+ep,p.y))-_Noise(float2(p.x-ep,p.y));
    float grady = _Noise(float2(p.x,p.y+ep))-_Noise(float2(p.x,p.y-ep));
    return float2(gradx,grady);
}
float FlowFBM(in float2 p)
{
    float z=2.;
    float rz = 0.;
    float2 bp = p;
    for (float i= 1.;i < 9.;i++ )
    {
        //讓不同的層都添加不同的運動速度 形成一種明顯的 層次感
        p += ftime*.0006;
        bp += ftime*0.00006;
        //獲取梯度
        float2 gr = Gradn(i*p*1.54+ftime*.14)*4.;
        //添加旋轉 讓不同的圖層擁有不同的旋轉速度，形成整體有扭曲的感覺
        float2x2 rot = Rot2DRad(ftime*0.6-(0.05*p.x+0.07*p.y)*30.);
        gr = mul(rot,gr);
        p += gr*.5;
        //FBM實現
        rz+= (sin(_Noise(p)*7.)*0.5+0.5)/z;
        //插值調整每層之間效果
        p = lerp(bp,p,.77);
        //FBM 常規操作
        z *= 1.4;
        p *= 2.;
        bp *= 1.9;
    }
    return rz;  
}



2.顏色映射
// ...... Taken from https://www.shadertoy.com/view/MdBSRW
float3 Blackbody(float t)
{
    const  TEMPERATURE  = 2200.0;
    t *= TEMPERATURE;

    float u = ( 0.860117757 + 1.54118254e-4 * t + 1.28641212e-7 * t*t ) 
            / ( 1.0 + 8.42420235e-4 * t + 7.08145163e-7 * t*t );

    float v = ( 0.317398726 + 4.22806245e-5 * t + 4.20481691e-8 * t*t ) 
            / ( 1.0 - 2.89741816e-5 * t + 1.61456053e-7 * t*t );

    float x = 3.0*u / (2.0*u - 8.0*v + 4.0);
    float y = 2.0*v / (2.0*u - 8.0*v + 4.0);
    float z = 1.0 - x - y;

    float Y = 1.0;
    float X = Y / y * x;
    float Z = Y / y * z; 

    float3x3 XYZtoRGB = float3x3(3.2404542, -1.5371385, -0.4985314,
                        -0.9692660,  1.8760108,  0.0415560,
                            0.0556434, -0.2040259,  1.0572252);

    return max(float3(0.0,0.,0.), mul(XYZtoRGB,float3(X,Y,Z)) * pow(t * 0.0004, 4.0));
}

空間映射流程:
溫度 -> uv -> xy -> XYZ -> RGB
具體原理參考：色溫映射
更多熔岩實現可以參考：
這裏

和這裏

3.整合在一起

float3 ProcessFrag(float2 uv)
{
    uv*= _GridSize;
    float val = FlowFBM(uv);
    val = Remap(0.,

本教程配套項目源碼

本人shadertoy地址

第一時間更新blog地址