Computer Graphics & Visualization @ufrj.br
Published
Edited
May 5, 2022
1 fork
import { toy } from "@esperanc/shadertoy-ish"
// toy(`
// void main() {
// gl_FragColor = vec4(1.,0.,0.,1.);
// }
// `)
// toy(`
// void main() {
// gl_FragColor = vec4(1.,0.,0.,
// distance(gl_FragCoord.xy,vec2(250.,250.))/100.);
// }
// `)
// toy(`
// void main() {
// gl_FragColor = distance(gl_FragCoord.xy,vec2(250.,250.)) < 100. ?
// vec4 (1., 0., 0., 1.) :
// vec4 (0., 1., 1., 1.);
// }
// `)
// toy(`
// void main() {
// gl_FragColor = mix (vec4 (1., 0., 0., 1.),
// vec4 (0., 1., 1., 1.),
// float(distance(gl_FragCoord.xy,vec2(250.,250.)) > 100.));
// }
// `)
// toy(`
// void main() {
// gl_FragColor = mix (vec4 (1., 0., 0., 1.),
// vec4 (0., 1., 1., 1.),
// smoothstep(99.,101.,distance(gl_FragCoord.xy,vec2(250.,250.))));
// }
// `)
// toy(`
// void main() {
// vec2 p = (2.0*gl_FragCoord.xy-iResolution.xy)/iResolution.y;
// gl_FragColor = mix (vec4 (1., 0., 0., 1.),
// vec4 (0., 1., 1., 1.),
// smoothstep(0.5,0.51,length(p)));
// }
// `)
// toy(`
// float sdCircle( vec2 p, float r )
// {
// return length(p) - r;
// }
// void main() {
// vec2 p = (2.0*gl_FragCoord.xy-iResolution.xy)/iResolution.y;
// gl_FragColor = mix (vec4 (1., 0., 0., 1.),
// vec4 (0., 1., 1., 1.),
// smoothstep(-0.01,0.01,sdCircle(p,0.5)));
// }
// `)
// toy(`
// float sdBox( in vec2 p, in vec2 b )
// {
// vec2 d = abs(p)-b;
// return length(max(d,0.0)) + min(max(d.x,d.y),0.0);
// }
// void main() {
// vec2 p = (2.0*gl_FragCoord.xy-iResolution.xy)/iResolution.y;
// gl_FragColor = mix (vec4 (1., 0., 0., 1.),
// vec4 (0., 1., 1., 1.),
// smoothstep(0.,0.01,sdBox(p,vec2(0.5,0.5))));
// }
// `)
// toy(`
// float sdBox( in vec2 p, in vec2 b )
// {
// vec2 d = abs(p)-b;
// return length(max(d,0.0)) + min(max(d.x,d.y),0.0);
// }
// vec3 iqColor (float d) {
// vec3 col = (d>0.0) ? vec3(0.9,0.6,0.3) : vec3(0.5,0.85,1.0);
// col *= 1.0 - exp(-7.0*abs(d));
// col *= 0.8 + 0.2*cos(128.0*d);
// return mix( col, vec3(1.0), 1.0-smoothstep(0.0,0.01,abs(d)) );
// }
// void main() {
// vec2 p = (2.0*gl_FragCoord.xy-iResolution.xy)/iResolution.y;
// gl_FragColor = vec4(iqColor (sdBox(p,vec2(0.5,0.5))), 1.);
// }
// `)
// toy(`
// float sdBox( in vec2 p, in vec2 b ) {
// vec2 d = abs(p)-b;
// return length(max(d,0.0)) + min(max(d.x,d.y),0.0);
// }
// float sdCircle( vec2 p, float r ) {
// return length(p) - r;
// }
// float sdPrimitive (vec2 p) {
// return min(sdBox(p, vec2(0.6,0.4)),sdCircle(p,0.5));
// }
// vec3 iqColor (float d) {
// vec3 col = (d>0.0) ? vec3(0.9,0.6,0.3) : vec3(0.5,0.85,1.0);
// col *= 1.0 - exp(-7.0*abs(d));
// col *= 0.8 + 0.2*cos(128.0*d);
// return mix( col, vec3(1.0), 1.0-smoothstep(0.0,0.01,abs(d)) );
// }
// void main() {
// vec2 p = (2.0*gl_FragCoord.xy-iResolution.xy)/iResolution.y;
// gl_FragColor = vec4(iqColor (sdPrimitive(p)), 1.);
// }
// `)
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
