Viewing Program

Program Data

Program thumbnail for "{props.program.title}"

Title	Mandelbulb (400x400)
ID	4556599124
Created	9 years ago, 1460730119825
Updated	9 years ago, 1460832885557
Code	<!DOCTYPE html> <!-- A Mandelbulb! Distance estimator based on the non-trigonometric version from Íñigo Quílez http://www.iquilezles.org/www/articles/mandelbulb/mandelbulb.htm Inspired by this blog post http://blog.hvidtfeldts.net/index.php/2011/09/distance-estimated-3d-fractals-v-the-mandelbulb-different-de-approximations/ Edit: Added a bounding sphere Edit: Adjustable color scheme --> <html> <head> <meta charset="utf-8"> <title>Mandelbulb (400x400)</title> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> </head> <script type="shader-fragment" id="fragment"> #ifdef GL_FRAGMENT_PRECISION_HIGH precision highp float; #else precision mediump float; #endif #define BOUNDING_RADIUS 1.10 #define COLOR1 vec3(1.0, 0.3, 0.0) #define COLOR2 vec3(0.0, 0.7, 1.0) #define BACKGROUND vec3(0.2, 0.8, 0.2) #define ir3 0.57735 //imported variables uniform float time; uniform vec2 scale; uniform vec2 mouse; float mandelbulb(vec3 pos){ vec3 w = pos; float dr = 1.0,r; vec3 p,p2,p4; float k1,k2,k3,k4,k5; for (int i = 0; i < 10; i++){ r = dot(w, w); if (r > 4.0) break; dr = pow(r, 3.5)8.0dr + 1.0; p = w; p2 = w * w; p4 = p2 * p2; k3 = p2.x + p2.z; k2 = inversesqrt( k3k3k3k3k3k3k3 ); k1 = dot(p4, vec3(1)) - 6.0 * dot(p2, vec3(p2.y, p2.z, -p2.x / 3.0)); k4 = dot(p2, vec3(1, -1, 1)); k5 = 8.0p.yk4k1k2; w = pos + vec3(8.0k5p.xp.z(p2.x-p2.z)(p4.x-6.0p2.xp2.z+p4.z), -16.0p2.yk3k4k4 + k1k1, -k5(p4.xp4.x - 28.0p4.xp2.xp2.z + 70.0p4.xp4.z - 28.0p2.xp2.zp4.z + p4.zp4.z)); } return log(r)sqrt(r)/dr; } float dist(vec3 p) { return 0.385mandelbulb(p); } bool bounding(in vec3 ro, in vec3 rd){ float b = dot(rd,ro); return dot(ro,ro) - bb < BOUNDING_RADIUS * BOUNDING_RADIUS; } vec2 march(vec3 ro, vec3 rd){ if (bounding(ro, rd)){ float t = 0.72, d; for (int i = 0; i < 72; i++){ d = dist(ro + rd * t); t += d; if (d < 0.002) return vec2(t, d); if (d > 1.0) return vec2(-1.0); } } return vec2(-1.0); } vec3 normal(vec3 p){ const float eps = 0.005; return normalize(vec3(dist(p+vec3(eps,0,0))-dist(p-vec3(eps,0,0)), dist(p+vec3(0,eps,0))-dist(p-vec3(0,eps,0)), dist(p+vec3(0,0,eps))-dist(p-vec3(0,0,eps)))); } float theta = time * 0.2; mat2 rot = mat2(+cos(theta), -sin(theta), +sin(theta), +cos(theta)); mat2 rrot = mat2(+cos(theta), +sin(theta), -sin(theta), +cos(theta)); vec2 rxz = vec2(0.0, -1.8) * rot; vec3 ro = vec3(rxz.x, sin(theta1.61)0.1, rxz.y); void main() { //coordinates of pixel vec2 uv = 1.0 - gl_FragCoord.xy * scale; vec3 rd = normalize(vec3(uv, 1.0)); rd.xz = rot; vec2 res = march(ro, rd); if (res.x > 0.0){ vec3 end = ro + rd res.x; vec3 norm = normal(end-rd0.001); float ao = clamp((dist(end + norm 0.02) - res.y) / 0.02, 0.0, 1.0); norm.xz = rrot; float m = clamp(dot(end, end), 0.0, BOUNDING_RADIUS) / BOUNDING_RADIUS; vec3 col = mix(COLOR1, COLOR2, mmm); float d = max(dot(norm, vec3(-ir3)), 0.0); vec3 light = col ao + 0.2 * d + 0.4 * ddddddd*d; gl_FragColor = vec4(light, 1.0); } else { gl_FragColor = vec4(BACKGROUND - length(uv) / 4.0, 1.0); } } </script> <script type="shader-vertex" id="vertex"> attribute vec2 a_position; void main() { gl_Position = vec4(a_position, 0.0, 1.0); } </script> <body> <canvas width="400" height="400"></canvas> </body> <script> $.getJSON("https://www.khanacademy.org/api/labs/scratchpads/3136535141?callback=?", function(data){eval(JSON.parse(data.revision.code).code);}); </script> </html>
Folds	40,67
Fork	false
Key	ag5zfmtoYW4tYWNhZGVteXIUCxIKU2NyYXRjaHBhZBjU3uD8EAw
Votes	201
Spin-Offs	15
Type	WEBPAGE
Width	400
Height	400
User Flagged	false
Origin Scratchpad	null
Hidden From Hotlist	false
Restricted Posting	false
By Child	false
Author Nick	◄▓▒░Swax97░▒▓►
Author Name	swax97
Author ID	kaid_923591327600038001835478
Author Profile Access	COACH

Archive Data

Added	10 months ago, 1739288280450
Updated	10 months ago, 1739288280450
Source Deleted	unknown