- Sign In
- Sign Up
FFT Texture
The simplest possible audio visualizer to serve as an example of how to use the fftTexture uniform.
Created by marcogomez on Sun, 13 Jun 2021 16:00:18 GMT.
// ╔═════════════╦════════════════╗ // ║ Marco Gomez ║ https://mgz.me ║ // ╚═════════════╩════════════════╝ precision highp float; uniform sampler2D fftTexture; uniform vec2 resolution; void main(void) { vec2 uv = gl_FragCoord.xy / resolution.xy; uv.x = (uv.x - 0.5 > 0.0) ? uv.x - 0.5 : 0.5 - uv.x; uv *= 1.5; uv.y *= 1.2; const float bands = 64.0; const float segs = 32.0; vec2 p; p.x = floor(uv.x * bands) / bands; p.y = floor(uv.y * segs) / segs; float fftData = texture2D(fftTexture, vec2(p.x, 0.0)).x; vec3 color = mix(vec3(0.0, 0.5, 2.0), vec3(0.7, 0.0, 0.9), sqrt(uv.y + 0.5)); float mask = (p.y < fftData) ? 1.0 : 0.5; vec2 d = fract((uv - p) * vec2(bands, segs)) - 0.5; float led = smoothstep(0.5, 0.35, abs(d.x)) * smoothstep(0.75, 0.25, abs(d.y)); vec3 ledColor = led * color * mask; ledColor.x = smoothstep(0.0, 1.0, ledColor.x); ledColor.x = smoothstep(0.0, 1.0, ledColor.x); ledColor.x = pow(abs(ledColor.x), 3.0); gl_FragColor = vec4(ledColor * ledColor, 1.0); }
xxxxxxxxxx
// ╔═════════════╦════════════════╗
// ║ Marco Gomez ║ https://mgz.me ║
// ╚═════════════╩════════════════╝
precision highp float;
uniform sampler2D fftTexture;
uniform vec2 resolution;
void main(void) {
vec2 uv = gl_FragCoord.xy / resolution.xy;
uv.x = (uv.x - 0.5 > 0.0) ? uv.x - 0.5 : 0.5 - uv.x;
uv *= 1.5;
uv.y *= 1.2;
const float bands = 64.0;
const float segs = 32.0;
vec2 p;
p.x = floor(uv.x * bands) / bands;
p.y = floor(uv.y * segs) / segs;
float fftData = texture2D(fftTexture, vec2(p.x, 0.0)).x;
vec3 color = mix(vec3(0.0, 0.5, 2.0), vec3(0.7, 0.0, 0.9), sqrt(uv.y + 0.5));
float mask = (p.y < fftData) ? 1.0 : 0.5;
vec2 d = fract((uv - p) * vec2(bands, segs)) - 0.5;
float led = smoothstep(0.5, 0.35, abs(d.x)) * smoothstep(0.75, 0.25, abs(d.y));
vec3 ledColor = led * color * mask;
ledColor.x = smoothstep(0.0, 1.0, ledColor.x);
ledColor.x = smoothstep(0.0, 1.0, ledColor.x);
ledColor.x = pow(abs(ledColor.x), 3.0);
gl_FragColor = vec4(ledColor * ledColor, 1.0);
}
96 fps 16ms
00:00:00.34
0.00