Is there a way to rotate the Checkerboard so that it always fills the viewer (before passing it down the chain)?
To put it another way, in QC, generators with infinite bounds could be rotated/transformed in a “pre-rendered” state, anything like this currently?
This might make for a FR, a node called Generate 2-color Pattern or something, piled into one generator checkerboard, stripes, dots, wave. I guess we could also make our own “procedural” textures in GLSL, but I’m still new with all that.
Ok, Make Image with Shadertoy gave me an opportunity to chip away at some basic fragment shader stuff.
(If I am allowed to ask one more little question here before it becomes another discussion, how could I introduce “softness” into the shader? Smoothstep? Btw, tried to insert the shader code for convenient viewing, no luck with the Vuo site…)
Ok, I’m lazy… here’s the very basic GLSL checkerboard. I saw a fancier one on the shadertoy site with smoothstep, but I understand this one, so I stuck with it to learn. Still don’t have the smoothstep function working here, I struggle.
But most probably that isn’t the same syntax of markdown that Vuo uses. I know John is a living programming gem, but I just find it impossible to read quickly that cheat sheet, maybe its the color and all. Must me me.
There is also online markdown for code highlighting… (may be useful in future, as it looks like Vuo is going to get some pretty intense coding updates: GLSL in 1.3 & Future Plans for running C/C++ code directly.
Hey @jersmi, I got tired of trying to fit smoothstep() into the shader and cheated instead. I have used smoothstep() for lots of things like this, but this was easier.
vec2 rot(vec2 uv,float a)
return vec2(uv.x * cos(a) - uv.y * sin(a), uv.y * cos(a) + uv.x * sin(a));
vec2 uv = iResolution.xy;
uv = .5 * (uv - 2.0 * gl_FragCoord.xy) / uv.x;
uv = rot(uv, iGlobalTime);
//checkerboard square size in pixels
float size = 50.0 / iResolution.x;
//draw smooth checkerboard
uv.x = sin(uv.x/size); //draw a sine wave on the X axis as many times as size permits
uv.y = cos(uv.y/size); //draw a cos wave on the Y axis as many times as size permits
float smoothcheckerboard = uv.x * uv.y;
gl_FragColor = smoothcheckerboard * vec4(1.0, 1.0, 1.0, 1.0);
Also understand that as we are multiplying smoothcheckerboard with RGBA (in vec4) we are also creating an image with alpha, which when saved as a PNG from within Vuo will contain transparent black checkers. (which is AWESOME-but maybe not what you want- the resulting PNG will be white unless viewed with alpha)
To make it opaque, just remove the alpha from the final equation:
Here’s a different approach, taken from Shader - Shadertoy BETA , converted for Vuo with a few other changes (like making it rotate from the center). I like this one because it uses fwidth for smoothstep antialiasing. (What’s the best way to change color for this one?)
float divs = 16.0;
float rot = 0.0; //initial rotation in degrees
float aa = 8.0;
float PI = 3.14159265359;
float d = rot / (180.0 / PI); //rotation in degrees
float t = d + (iGlobalTime * 0.1);
float st = sin(t);
float ct = cos(t);
vec2 div = divs*iResolution.yy/iResolution.xx;
vec2 uv = 0.5*iResolution.xy - gl_FragCoord.xy;
uv = uv.xy / iResolution.y;
vec2 xy0 = divs*uv;
xy.x = ct*xy0.x + st*xy0.y; // rotate grid by t
xy.y = -st*xy0.x + ct*xy0.y;
//xy.x -= iGlobalTime*0.2; //animate x-axis
vec2 sxy = sin(PI*xy);
vec2 b = fwidth(sxy)*aa;
vec2 pxy = smoothstep( -b, b, sxy );
pxy = 2.0*pxy - 1.0; // remap to [-1..1]
float a = 0.5*(pxy.x * pxy.y) + 0.5; // combine sine waves and remap to [0..1]
float c = sqrt( a ); // correct for gamma
gl_FragColor = vec4(c, c, c, 1.0);