移植Godot gdshader水着色器到Bevy WGSL时出现噪点接缝问题

问题说明 #

我正尝试将GodotShaders上的一款水着色器从gdshader移植到Bevy的WGSL中，但渲染出的噪点存在明显接缝，模糊过渡无法做到无缝衔接。同款逻辑的gdshader在Godot中却能正常实现无缝效果。

WGSL代码与gdshader逻辑基本一致，但噪点接缝问题仍未解决。已查明颜色差异源于色彩空间不同，通过srgb转线性空间函数可解决，但接缝问题卡壳，需要相关帮助或指导。

代码对比 #

WGSL 实现代码 #

fn rand(uv: vec2<f32>) -> f32 {
    return (fract(sin(dot(uv.xy, vec2(23.53, 44.0))) * 42350.45));
}

fn noise(uv: vec2<f32>) -> f32 {
    let i: vec2<f32> = floor(uv);
    let j: vec2<f32> = fract(uv);
    let blur: vec2<f32> = smoothstep(vec2<f32>(0.0, 0.0), vec2<f32>(1.0, 1.0), j);

    let a: f32 = rand(i);
    let b: f32 = rand(i + vec2<f32>(1.0, 0.0));

    return mix(a, b, blur.x);
}

@fragment
fn fragment(in: VertexOutput) -> @location(0) vec4<f32> {
    let UV = in.uv * 10.0;
    return vec4<f32>(vec3<f32>(1.0) * noise(UV), 1.0);
}

Godot gdshader 实现代码 #

float rand(vec2 input){
    return fract(sin(dot(input,vec2(23.53,44.0)))*42350.45);
}

float noise(vec2 input){
    vec2 i = floor(input);
    vec2 j = fract(input);
    vec2 blur = smoothstep(0.0, 1.0, j);

    float a = rand(i);
    float b = rand(i + vec2(1.0, 0.0));

    return mix(a, b, blur.x);
}

void fragment(){
    COLOR = vec4(vec3(1.0) * noise(UV * 10.0), 1.0);
}

已解决的问题：色彩空间转换 #

通过以下srgb转线性空间函数解决了颜色差异问题：

fn srgb2lin(color: vec3<f32>) -> vec3<f32> {
    let in_c_lo: vec3<f32> = color / 12.92;
    let in_c_hi: vec3<f32> = pow((color + 0.055) / 1.055, vec3<f32>(2.4));
    let in_s: vec3<f32> = step(vec3<f32>(0.04045), color);
    
    return mix(in_c_lo, in_c_hi, in_s);
}

疑问点 #

推测差异可能来自WGSL、Bevy的特性，或是UV坐标/fract函数的表现不同，但无法定位具体原因，希望得到指导解决噪点接缝问题。

内容的提问来源于stack exchange，提问作者Racid