From 7bff6fb972ad25fb6a740a751ccfe2164278da19 Mon Sep 17 00:00:00 2001 From: Patricio Gonzalez Vivo Date: Tue, 8 Sep 2015 07:12:37 -0400 Subject: [PATCH] more noise functions --- 11/2d-voronoi.frag | 77 +++++++++++++++++ 11/README.md | 3 +- 11/circleDistortion.frag | 101 +++++++++++++++++++++++ 11/{shape.frag => circleWave-noise.frag} | 4 +- 11/circleWave-noiseChannels.frag | 92 +++++++++++++++++++++ 11/vortex.frag | 97 ++++++++++++++++++++++ 6 files changed, 372 insertions(+), 2 deletions(-) create mode 100644 11/2d-voronoi.frag create mode 100644 11/circleDistortion.frag rename 11/{shape.frag => circleWave-noise.frag} (96%) create mode 100644 11/circleWave-noiseChannels.frag create mode 100644 11/vortex.frag diff --git a/11/2d-voronoi.frag b/11/2d-voronoi.frag new file mode 100644 index 0000000..910c429 --- /dev/null +++ b/11/2d-voronoi.frag @@ -0,0 +1,77 @@ +#ifdef GL_ES +precision mediump float; +#endif + +uniform vec2 u_resolution; +uniform vec2 u_mouse; +uniform float u_time; + +// Created by inigo quilez - iq/2013 +// License Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License. +// http://www.iquilezles.org/www/articles/voronoilines/voronoilines.htm + +vec2 random2( vec2 p ) { + return fract(sin(vec2(dot(p,vec2(127.1,311.7)),dot(p,vec2(269.5,183.3))))*43758.5453); +} + +#define ANIMATE +vec3 voronoi( in vec2 x ) { + vec2 n = floor(x); + vec2 f = fract(x); + + // first pass: regular voronoi + vec2 mg, mr; + float md = 8.0; + for (int j=-1; j<=1; j++ ) { + for (int i=-1; i<=1; i++ ) { + vec2 g = vec2(float(i),float(j)); + vec2 o = random2( n + g ); + #ifdef ANIMATE + o = 0.5 + 0.5*sin( u_time + 6.2831*o ); + #endif + vec2 r = g + o - f; + float d = dot(r,r); + + if( d0.00001 ) + md = min( md, dot( 0.5*(mr+r), normalize(r-mr) ) ); + } + } + return vec3( md, mr ); +} + +void main() { + vec2 st = gl_FragCoord.xy/u_resolution.xy; + vec3 color = vec3(0.0); + + vec3 c = voronoi( 8.0*st ); + + // isolines + color = c.x*(0.5 + 0.5*sin(64.0*c.x))*vec3(1.0); + // borders + color = mix( vec3(1.0,0.6,0.0), color, smoothstep( 0.01, 0.02, c.x ) ); + // feature points + float dd = length( c.yz ); + color = mix( vec3(1.0,0.6,0.1), color, smoothstep( 0.0, 0.12, dd) ); + color += vec3(1.0,0.6,0.1)*(1.0-smoothstep( 0.0, 0.04, dd)); + + gl_FragColor = vec4(color,1.0); +} \ No newline at end of file diff --git a/11/README.md b/11/README.md index 4173bc6..861db09 100644 --- a/11/README.md +++ b/11/README.md @@ -132,8 +132,9 @@ Yeah, right? How he did that? Well we saw that for one dimension he was smoothly ![](2^N.png) - ## Digital Jackson Pollock +# Voronoi Noise + diff --git a/11/circleDistortion.frag b/11/circleDistortion.frag new file mode 100644 index 0000000..46d4063 --- /dev/null +++ b/11/circleDistortion.frag @@ -0,0 +1,101 @@ +// Author @patriciogv - 2015 +// http://patriciogonzalezvivo.com + +// My own port of this processing code by @beesandbombs +// https://dribbble.com/shots/1696376-Circle-wave + +#ifdef GL_ES +precision mediump float; +#endif + +uniform vec2 u_resolution; +uniform vec2 u_mouse; +uniform float u_time; + +vec3 mod289(vec3 x) { return x - floor(x * (1.0 / 289.0)) * 289.0; } +vec2 mod289(vec2 x) { return x - floor(x * (1.0 / 289.0)) * 289.0; } +vec3 permute(vec3 x) { return mod289(((x*34.0)+1.0)*x); } + +float snoise(vec2 v) { + const vec4 C = vec4(0.211324865405187, // (3.0-sqrt(3.0))/6.0 + 0.366025403784439, // 0.5*(sqrt(3.0)-1.0) + -0.577350269189626, // -1.0 + 2.0 * C.x + 0.024390243902439); // 1.0 / 41.0 + // First corner + vec2 i = floor(v + dot(v, C.yy) ); + vec2 x0 = v - i + dot(i, C.xx); + + // Other corners + vec2 i1; + i1 = (x0.x > x0.y) ? vec2(1.0, 0.0) : vec2(0.0, 1.0); + vec4 x12 = x0.xyxy + C.xxzz; + x12.xy -= i1; + + // Permutations + i = mod289(i); // Avoid truncation effects in permutation + vec3 p = permute( permute( i.y + vec3(0.0, i1.y, 1.0 )) + + i.x + vec3(0.0, i1.x, 1.0 )); + + vec3 m = max(0.5 - vec3(dot(x0,x0), dot(x12.xy,x12.xy), dot(x12.zw,x12.zw)), 0.0); + m = m*m ; + m = m*m ; + + // Gradients: 41 points uniformly over a line, mapped onto a diamond. + // The ring size 17*17 = 289 is close to a multiple of 41 (41*7 = 287) + + vec3 x = 2.0 * fract(p * C.www) - 1.0; + vec3 h = abs(x) - 0.5; + vec3 ox = floor(x + 0.5); + vec3 a0 = x - ox; + + // Normalise gradients implicitly by scaling m + // Approximation of: m *= inversesqrt( a0*a0 + h*h ); + m *= 1.79284291400159 - 0.85373472095314 * ( a0*a0 + h*h ); + + // Compute final noise value at P + vec3 g; + g.x = a0.x * x0.x + h.x * x0.y; + g.yz = a0.yz * x12.xz + h.yz * x12.yw; + return 130.0 * dot(m, g); +} + +vec3 nNoise(vec2 st) { + vec2 offset = vec2(1.)/u_resolution.xy; + float center = snoise(vec2(st.x, st.y)); + float topLeft = snoise(vec2(st.x - offset.x, st.y - offset.y)); + float left = snoise(vec2(st.x - offset.x, st.y)); + float bottomLeft = snoise(vec2(st.x - offset.x, st.y + offset.y)); + float top = snoise(vec2(st.x, st.y - offset.y)); + float bottom = snoise(vec2(st.x, st.y + offset.y)); + float topRight = snoise(vec2(st.x + offset.x, st.y - offset.y)); + float right = snoise(vec2(st.x + offset.x, st.y)); + float bottomRight= snoise(vec2(st.x + offset.x, st.y + offset.y)); + float dX = topRight + 2.0 * right + bottomRight - topLeft - 2.0 * left - bottomLeft; + float dY = bottomLeft + 2.0 * bottom + bottomRight - topLeft - 2.0 * top - topRight; + return normalize(vec3( dX, dY, 0.01))*.5+.5; +} + +float shape(vec2 st, float radius) { + st = vec2(0.5)-st; + float r = length(st)*2.0; + float a = atan(st.y,st.x); + + float f = radius; + return 1.-smoothstep(f,f+0.007,r); +} + +float shapeBorder(vec2 st, float radius, float width) { + return shape(st,radius)-shape(st,radius-width); +} + +void main() { + vec2 st = gl_FragCoord.xy/u_resolution.xy; + + vec3 color = vec3(0.0); + vec3 normals = nNoise(st*6.+u_time); + color = vec3(1.) * shapeBorder(st,0.8,0.02); + st -= .005; + color.g = shapeBorder(st+normals.xy*.01,0.81,0.03); + + gl_FragColor = vec4( color, 1.0 ); +} \ No newline at end of file diff --git a/11/shape.frag b/11/circleWave-noise.frag similarity index 96% rename from 11/shape.frag rename to 11/circleWave-noise.frag index 934618b..bb5db21 100644 --- a/11/shape.frag +++ b/11/circleWave-noise.frag @@ -73,7 +73,9 @@ float shape(vec2 st, float radius) { a *= 1.+abs(atan(u_time*0.2))*.1; // a *= 1.+snoise(st+u_time*0.1)*0.1; // a *= 1.+snoise(vec2(a,r)+u_time*0.1)*.1; - float f = (cos(a*50.)*.1*pow(m,2.))+radius; + float f = radius; + // f += sin(a*10.)*snoise(st+u_time*.2)*.1; + f += (cos(a*50.)*.1*pow(m,2.)); return 1.-smoothstep(f,f+0.007,r); } diff --git a/11/circleWave-noiseChannels.frag b/11/circleWave-noiseChannels.frag new file mode 100644 index 0000000..cb573cd --- /dev/null +++ b/11/circleWave-noiseChannels.frag @@ -0,0 +1,92 @@ +// Author @patriciogv - 2015 +// http://patriciogonzalezvivo.com + +// My own port of this processing code by @beesandbombs +// https://dribbble.com/shots/1696376-Circle-wave + +#ifdef GL_ES +precision mediump float; +#endif + +uniform vec2 u_resolution; +uniform vec2 u_mouse; +uniform float u_time; + +vec3 mod289(vec3 x) { return x - floor(x * (1.0 / 289.0)) * 289.0; } +vec2 mod289(vec2 x) { return x - floor(x * (1.0 / 289.0)) * 289.0; } +vec3 permute(vec3 x) { return mod289(((x*34.0)+1.0)*x); } + +float snoise(vec2 v) { + const vec4 C = vec4(0.211324865405187, // (3.0-sqrt(3.0))/6.0 + 0.366025403784439, // 0.5*(sqrt(3.0)-1.0) + -0.577350269189626, // -1.0 + 2.0 * C.x + 0.024390243902439); // 1.0 / 41.0 + // First corner + vec2 i = floor(v + dot(v, C.yy) ); + vec2 x0 = v - i + dot(i, C.xx); + + // Other corners + vec2 i1; + i1 = (x0.x > x0.y) ? vec2(1.0, 0.0) : vec2(0.0, 1.0); + vec4 x12 = x0.xyxy + C.xxzz; + x12.xy -= i1; + + // Permutations + i = mod289(i); // Avoid truncation effects in permutation + vec3 p = permute( permute( i.y + vec3(0.0, i1.y, 1.0 )) + + i.x + vec3(0.0, i1.x, 1.0 )); + + vec3 m = max(0.5 - vec3(dot(x0,x0), dot(x12.xy,x12.xy), dot(x12.zw,x12.zw)), 0.0); + m = m*m ; + m = m*m ; + + // Gradients: 41 points uniformly over a line, mapped onto a diamond. + // The ring size 17*17 = 289 is close to a multiple of 41 (41*7 = 287) + + vec3 x = 2.0 * fract(p * C.www) - 1.0; + vec3 h = abs(x) - 0.5; + vec3 ox = floor(x + 0.5); + vec3 a0 = x - ox; + + // Normalise gradients implicitly by scaling m + // Approximation of: m *= inversesqrt( a0*a0 + h*h ); + m *= 1.79284291400159 - 0.85373472095314 * ( a0*a0 + h*h ); + + // Compute final noise value at P + vec3 g; + g.x = a0.x * x0.x + h.x * x0.y; + g.yz = a0.yz * x12.xz + h.yz * x12.yw; + return 130.0 * dot(m, g); +} + +mat2 rotate2d(float _angle){ + return mat2(cos(_angle),-sin(_angle), + sin(_angle),cos(_angle)); +} + +float shape(vec2 st, vec2 offset, float radius) { + st = vec2(0.5)-st; + float r = length(st)*2.0; + float a = atan(st.y,st.x); + float m = abs(mod(a+offset.y*2.,3.14*2.)-3.14)/3.6; + m += snoise(st+u_time*0.1)*.8; + a += offset.x; + float f = radius; + f += (cos(a*20.)*.1*pow(m,2.)); + return 1.-smoothstep(f,f+0.007,r); +} + +float shapeBorder(vec2 st, vec2 offset, float radius, float width) { + return shape(st,offset,radius)-shape(st,offset,radius-width); +} + +void main() { + vec2 st = gl_FragCoord.xy/u_resolution.xy; + vec3 color = vec3(.0); + float t = u_time*.1; + color.r = shapeBorder(st,vec2(0.1,t),0.8,0.02); + color.g = shapeBorder(st,vec2(0.2,t),0.8,0.02); + color.b = shapeBorder(st,vec2(0.3,t),0.8,0.02); + + gl_FragColor = vec4( color, 1.0 ); +} \ No newline at end of file diff --git a/11/vortex.frag b/11/vortex.frag new file mode 100644 index 0000000..cb3520a --- /dev/null +++ b/11/vortex.frag @@ -0,0 +1,97 @@ +// Author @patriciogv - 2015 +// http://patriciogonzalezvivo.com + +#ifdef GL_ES +precision mediump float; +#endif + +uniform vec2 u_resolution; +uniform vec2 u_mouse; +uniform float u_time; + +// +// Description : Array and textureless GLSL 2D simplex noise function. +// Author : Ian McEwan, Ashima Arts. +// Maintainer : ijm +// Lastmod : 20110822 (ijm) +// License : Copyright (C) 2011 Ashima Arts. All rights reserved. +// Distributed under the MIT License. See LICENSE file. +// https://github.com/ashima/webgl-noise +// + +vec3 mod289(vec3 x) { return x - floor(x * (1.0 / 289.0)) * 289.0; } +vec2 mod289(vec2 x) { return x - floor(x * (1.0 / 289.0)) * 289.0; } +vec3 permute(vec3 x) { return mod289(((x*34.0)+1.0)*x); } + +float snoise(vec2 v) { + const vec4 C = vec4(0.211324865405187, // (3.0-sqrt(3.0))/6.0 + 0.366025403784439, // 0.5*(sqrt(3.0)-1.0) + -0.577350269189626, // -1.0 + 2.0 * C.x + 0.024390243902439); // 1.0 / 41.0 + // First corner + vec2 i = floor(v + dot(v, C.yy) ); + vec2 x0 = v - i + dot(i, C.xx); + + // Other corners + vec2 i1; + i1 = (x0.x > x0.y) ? vec2(1.0, 0.0) : vec2(0.0, 1.0); + vec4 x12 = x0.xyxy + C.xxzz; + x12.xy -= i1; + + // Permutations + i = mod289(i); // Avoid truncation effects in permutation + vec3 p = permute( permute( i.y + vec3(0.0, i1.y, 1.0 )) + + i.x + vec3(0.0, i1.x, 1.0 )); + + vec3 m = max(0.5 - vec3(dot(x0,x0), dot(x12.xy,x12.xy), dot(x12.zw,x12.zw)), 0.0); + m = m*m ; + m = m*m ; + + // Gradients: 41 points uniformly over a line, mapped onto a diamond. + // The ring size 17*17 = 289 is close to a multiple of 41 (41*7 = 287) + + vec3 x = 2.0 * fract(p * C.www) - 1.0; + vec3 h = abs(x) - 0.5; + vec3 ox = floor(x + 0.5); + vec3 a0 = x - ox; + + // Normalise gradients implicitly by scaling m + // Approximation of: m *= inversesqrt( a0*a0 + h*h ); + m *= 1.79284291400159 - 0.85373472095314 * ( a0*a0 + h*h ); + + // Compute final noise value at P + vec3 g; + g.x = a0.x * x0.x + h.x * x0.y; + g.yz = a0.yz * x12.xz + h.yz * x12.yw; + return 130.0 * dot(m, g); +} + +float cascade(vec2 st, float time) { + vec2 pos = st*vec2(30.,2.*st.y*st.y)+vec2(0.,time); + float n = (.5+snoise(pos)*.5)*(st.y-.2); + return smoothstep(.4,.6,n); +} + +float circe(vec2 st, float radius) { + st = vec2(0.5)-st; + float r = length(st)*2.0; + float a = atan(st.y,st.x); + return 1.-smoothstep(radius,radius+0.007,r); +} + +float ring(vec2 st, float radius, float width) { + return circe(st,radius)-circe(st,radius-width); +} + +void main() { + vec2 st = gl_FragCoord.xy/u_resolution.xy; + vec3 color = vec3(0.0); + vec2 pos = st-vec2(.5); + float r = dot(pos,pos); + float a = atan(pos.y,pos.x); + color += ring(st,0.65,.01); + color *= 1.5; + color += cascade(vec2(a,r*10.),u_time*2.) * smoothstep(.11,.1,r); + + gl_FragColor = vec4(color,1.0); +} \ No newline at end of file