为什么webgl-noise不能给出随机值？

Question

我使用以下代码以及webgl-noise

中的noise3D生成器

void main() {
float noise = snoise(vec3(gl_FragCoord.x, gl_FragCoord.y, 0.0));
    vec4(1.0, 1.0, 1.0, noise);
}

我期待一个完全随机的输出，但我得到的是：

我做错了什么？

编辑：您看到的是单个纹理，我在SFML中应用着色器，如下所示：

window.draw(myTexture, myShader);

Answer 1

据我了解，噪音特别不是随机的，而是更自然的“随机性”。 http://en.wikipedia.org/wiki/Perlin_noise概述了Perlin噪音，我认为这就是你正在使用的。

你的图像有点太非随机，我怀疑你的编码有误。我们能看到整个应用吗？

好的，@安已破解了它。

Answer 2

如果你包含了noise3D库的功能，你可以与“随机性”进行“分屏”比较

// My own random number generator
// See Stack Overflow: http://stackoverflow.com/questions/5149544/can-i-generate-a-random-number-inside-a-pixel-shader/10625698#10625698
float random( vec2 p )
{
    vec2 r = vec2(23.14069263277926,2.665144142690225 );
    return fract( cos( mod( 12345678., 256. * dot(p,r) ) ) );
}

void main()
{
    vec2  p  = (-iResolution.xy + 2.0*gl_FragCoord.xy) / iResolution.y;
    float th = (-iResolution.x + 2.0*iMouse.x) / iResolution.y;

    if( iMouse.z<0.01) th = 0.5/ iResolution.y;
    float noise = snoise(vec3(gl_FragCoord.x, gl_FragCoord.y, 0.0));

    // Thanks to I.Q. for this interactive split screen!
    // https://www.shadertoy.com/view/MdjGR1
    if( p.x > th )
        noise = random( p );

    vec3 color = vec3(noise, noise, noise );
    color *= smoothstep( 0.006, 0.008, abs(p.x-th) );
    gl_FragColor = vec4( color, 1.0 );
}

ShaderToy版本与“分屏”比较：https://www.shadertoy.com/view/XtX3D4

Answer 3

首先，这不是应该使用perlin噪音的方式。

这种非平铺perlin函数每1x1单位生成渐变。

    snoise(vec3(gl_FragCoord.x, gl_FragCoord.y, 0.0))

这条线是愚蠢的。因为它调用snoise（1,1,0），snoise（1,2,0）... 它等于一个随机函数。

你应该得到snoise（1.001,1,0），snoise（1.002,1,0）的值。 然后你会看到美丽的自然柏林噪音。

perlin噪声着色器的简化版本使用快速但不好的方式生成随机渐变。作者假设你会扩大噪音，重复的模式将是不明显的。

我建议使用基于纹理的着色器来获得良好的随机效果。纹理应包含复杂的排列信息，这有助于着色器生成随机效果。

Answer 4

更好地表达@Alchemist所获得的内容：

snoise(vec3(gl_FragCoord.x, gl_FragCoord.y, 0.0));

使用的x和y值变化太快（太高＆＃34;频率＆＃34;）。像snoise这样的柏林噪音在这个规模上并不好看。它的设计具有大致单位尺寸的特征。您使用像素（或多或少）作为单位，因此随机要素是像素大小的，使它们不平滑，并且周期也太小。

相反，请使用

float r = 10.0 / iResolution.y; // pseudocode
snoise(vec3(gl_FragCoord.x * r, gl_FragCoord.y * r, 0.0));

其中iResolution.y是窗口的y分辨率。现在，噪音模式将足够大，看起来更平滑，并且周期将足够大，以至于它不会在您的图像中明显重复。