Published
Edited
Dec 17, 2020
4 stars
Insert cell
Insert cell
bnbShader(await raymarch({
// background: `vec3(22./255.)`,
eye: `vec3(6)`,
sceneSDF: `
#define TAU ${Math.PI * 2}

${iqSDF.sdBox()}
${iqSDF.sdSphere()}
${iqSDF.opSubtraction()}
${iqSDF.opIntersection()}
${iqSDF.sdCylinder()}
${iqSDF.opRep()}
${rotate3D()}
${await snoise4()}

float displacement(vec4 p) {
return snoise(p * .5);
}

float glow = 0.;

vec2 sceneSDF(vec3 p) {
p *= rotate3D(u_time * TAU, vec3(1, 1, 0));
float d = sdSphere(p, 3.);
d += displacement(vec4(p, sin(u_time * TAU)) + vec4(cos(u_time * TAU), -sin(u_time * TAU), sin(u_time * TAU) * cos(u_time * TAU), -cos(u_time * TAU)));
d *= .3;

// d = opIntersection(d, sdBox(p, vec3(40., 4.5, 40.)));
// d = opIntersection(d, min(
// sdBox(opRep(p, vec3(.2, 0., 0.)), vec3(.01, 5., 20.)),
// sdBox(opRep(p, vec3(0., 0., .2)), vec3(20., 5., .01))
// ));
return vec2(d, 8.);
}`,
computeColor: `
vec3 computeColor(vec3 ro, vec3 rd, vec3 pos, float d, float m) {
return (calcNormal(pos)) * .5 + .5;
}`,
effect: `
vec3 effect(vec3 c) {
c += glow * vec3(.2, .2, 1.);
return c;
}
`,
antiAliasing: 3,
logShader: true
}), {
w: 540, h: 540,
numFrames: 120,
fps: 20,
record: true,
// video: 'mp4'
})
Insert cell
Insert cell
Insert cell
Insert cell
import {iqSDF} from '@makio135/iq-sdf'
Insert cell
import {rotate3D, snoise3, snoise4} from '@makio135/glsl-snippets'
Insert cell

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.
Learn more