ノイズが大事！（GLSLを移植する場合）

###ノイズが大事！（GLSLを移植する場合）
標題の通りGLSLの移植にはノイズが大事という話です。
Shadertoyの以下のコードをopenframeworksのofxShadertoyで表示するように移植すると、
https://www.shadertoy.com/view/MdfGRX
↓こう表示されるべきなのに、
![out000048.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/430586/8fb57be6-3322-d98f-a107-4b90c2e5abaa.png)
↓こう表示されます。
![out000210.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/430586/ddfbe837-8718-02c0-9cfc-db35aef0ab86.png)

また、以下のコードは
https://www.shadertoy.com/view/XslGRr
正面から見ている場合はいいのですが、マウスで横から見ると、ご覧のように、不連続の
筋が目立ちます。
![out000004.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/430586/c09f253f-21f9-049b-3426-7ec0633120a7.png)
また、以下のコードでは、
https://www.shadertoy.com/view/WtVfWG
上の雲と同様に不連続な面が生じています。

![out001722.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/430586/d13c8416-3b61-c80e-029d-3bc1a8b0573c.png)

↓が正常です。

![out000172.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/430586/24c58da4-6e1f-a54b-b3fb-62ddf434d11e.png)

これら、IQ様のノイズに起因しているようで、IQ様のせいではなく、ノイズのインプリメントが原因だと思います。

```
// IQ's noise
float pn( in vec3 p )
{
    vec3 ip = floor(p);
    p = fract(p);
    p *= p*(3.0-2.0*p);
    vec2 uv = (ip.xy+vec2(37.0,17.0)*ip.z) + p.xy;
    uv = textureLod( iChannel0, (uv+ 0.5)/256.0, 0.0 ).yx;
    return mix( uv.x, uv.y, p.z );
}
```

shadertoy.comの色んなノイズテクsチャーやノイズを生成する関数を試してみたのですが、うまくいかず、結局たどりついたのが、ボリュームテクスチャーでした。

　ShaderToy+openframeworksでボリュームマップhttps://qiita.com/quittardis/items/085675de5d5ad30bd072
を参考に、以下のように変更して、ボリュームテクスチャーを使ってみたら、一応不連続な面は生じなくなりました。応急措置ですが...



```
float pn(in vec3 co)
{
      return texture(tex3D, co*0.08).x;
}
```

***simplexノイズ***
もちろん、予め生成された3Dテクスチャーではなく、GLSLで3Dノイズを生成させる方法もあります。

```
vec3 random3(vec3 c) {
	float j = 4096.0*sin(dot(c,vec3(17.0, 59.4, 15.0)));
	vec3 r;
	r.z = fract(512.0*j);
	j *= .125;
	r.x = fract(512.0*j);
	j *= .125;
	r.y = fract(512.0*j);
	return r-0.5;
}

/* skew constants for 3d simplex functions */
const float F3 =  0.3333333;
const float G3 =  0.1666667;

/* 3d simplex noise */
float simplex3d(vec3 p) {
	 /* 1. find current tetrahedron T and it's four vertices */
	 /* s, s+i1, s+i2, s+1.0 - absolute skewed (integer) coordinates of T vertices */
	 /* x, x1, x2, x3 - unskewed coordinates of p relative to each of T vertices*/
	 
	 /* calculate s and x */
	 vec3 s = floor(p + dot(p, vec3(F3)));
	 vec3 x = p - s + dot(s, vec3(G3));
	 
	 /* calculate i1 and i2 */
	 vec3 e = step(vec3(0.0), x - x.yzx);
	 vec3 i1 = e*(1.0 - e.zxy);
	 vec3 i2 = 1.0 - e.zxy*(1.0 - e);
	 	
	 /* x1, x2, x3 */
	 vec3 x1 = x - i1 + G3;
	 vec3 x2 = x - i2 + 2.0*G3;
	 vec3 x3 = x - 1.0 + 3.0*G3;
	 
	 /* 2. find four surflets and store them in d */
	 vec4 w, d;
	 
	 /* calculate surflet weights */
	 w.x = dot(x, x);
	 w.y = dot(x1, x1);
	 w.z = dot(x2, x2);
	 w.w = dot(x3, x3);
	 
	 /* w fades from 0.6 at the center of the surflet to 0.0 at the margin */
	 w = max(0.6 - w, 0.0);
	 
	 /* calculate surflet components */
	 d.x = dot(random3(s), x);
	 d.y = dot(random3(s + i1), x1);
	 d.z = dot(random3(s + i2), x2);
	 d.w = dot(random3(s + 1.0), x3);
	 
	 /* multiply d by w^4 */
	 w *= w;
	 w *= w;
	 d *= w;
	 
	 /* 3. return the sum of the four surflets */
	 return dot(d, vec4(42.0));
}
```
 このノイズを使って上記の雲を横から見たもの↓

![out000021.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/430586/55dde072-cf9c-4f40-565b-abcf1d323138.png)