Viewing Program

Program Data

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

Title	Coloring fractals with orbit traps
ID	6147667541835776
Created	5 years ago, 1606748646802
Updated	5 years ago, 1606920473646
Code	<!DOCTYPE html> <html> <!-- Measuring the closest distance a point gets to the origin throughout each iteration of the fractal process The fractal used is a julia fractal deformed by a series of folding transformations --> <head> <meta charset="utf-8"> <title>Coloring fractals with orbit traps</title> <style type="text/css"> body { margin: 0; background-color: #333; overflow: hidden; } </style> </head> <body> <canvas id="output" width="600" height="600">Your browser does not support HTML5</canvas> <script type="shader-vertex" id="vertex"> attribute vec2 a_position; void main() { gl_Position = vec4(a_position.xy, 0.0, 1.0); } </script> <script type="shader-fragment" id="fragment"> #version 100 #define PI 3.14159265358979 precision highp float; uniform float uTime; uniform vec2 scale; float time = (cos(uTime)+1.0)1.1; vec3 cameraPosition = 2.0 vec3(cos(uTime), 0, sin(uTime)); mat3 cameraMatrix = mat3( cos(uTime+3.14/2.0), 0, -sin(uTime+3.14/2.0), 0, 1, 0, sin(uTime+3.14/2.0), 0, cos(uTime+3.14/2.0)); vec4 offset = vec4(cos(time), sin(time), sin(time * 2.0 + 3.14), sin(time * 1.11 + 3.14)) * 0.5; vec3 lightDir = normalize(vec3(1, 1, 1)); void qFold (inout vec4 a) { a = vec4(a.xa.x-a.ya.y-a.za.z-a.wa.w,2.0a.xa.y,2.0a.xa.z,2.0a.xa.w); } void fold (inout vec4 a, vec4 n) { a -= 2.0 * n * max(dot(a, n), 0.0); } const vec4 foldingAxis = normalize(vec4(1.0, 1.0, -2.0, -3.0)); const vec4 foldingAxis2 = normalize(vec4(-1.0, 1.0, -2.0, -3.0)); const vec4 foldingAxis3 = normalize(vec4(1.0, -1.0, -2.0, -3.0)); vec2 map (vec3 pos) { vec4 z = vec4(pos.xyz, 0.0); float md2 = 1.0; float radius2 = dot(z, z); float smallest2 = 4.0; for (int i = 0; i < 100; i ++) { qFold(z); fold(z, foldingAxis); fold(z, foldingAxis2); fold(z, foldingAxis3); z += offset; md2 = 4.0 radius2; radius2 = dot(z, z); smallest2 = min(smallest2, radius2); if (radius2 > 4.0) break; } return vec2( sqrt(radius2 / md2)log(radius2)0.25-0.0001, smallest2); } vec3 calcNormal(vec3 p) { const float h = 0.000001; const vec2 k = vec2(1,-1); return normalize( k.xyymap( p + k.xyyh ).x + k.yyxmap( p + k.yyxh ).x + k.yxymap( p + k.yxyh ).x + k.xxxmap( p + k.xxxh ).x ); } vec3 trace (vec3 origin, vec3 direction) { float totalDistance = 0.0; for (float steps = 0.0; steps < 200.0; steps ++) { vec3 pos = origin + direction * totalDistance; vec2 distance = map(pos); totalDistance += distance.x; if (dot(pos, pos) > 5.0) break; if (distance.x < 0.002) { float hue = -sqrt(distance.y)/2.0+0.5; vec3 col = 0.5 + 0.5 * vec3( cos(hue * PI * 2.0), cos(hue * PI * 2.0 + 2.0 * PI / 3.0), cos(hue * PI * 2.0 + 4.0 * PI / 3.0)); vec3 normal = calcNormal(pos); float diffuse = max(-dot(normal, lightDir), 0.0); float specular = -dot(reflect(direction, normal), lightDir); specular = pow(max(specular, 0.0), 8.0); float occlusion = 1.0-steps/200.0; float shade = 0.3 * diffuse + 0.2 * specular + 0.5; return occlusion * shade * col; } } return vec3(0.0); } void main () { vec3 res = trace(cameraPosition, vec3(1.0 - scale * gl_FragCoord.xy, 1.0) * cameraMatrix); gl_FragColor = vec4(res.rgb, 1.0); } </script> <script id="xgl.js" type="text/javascript"> var program, canvas, gl, ctx; function ele(id) { return document.getElementById(id); } function initContext() { canvas = ele("output"); canvas.requestPointerLock = canvas.requestPointerLock \|\| canvas.mozRequestPointerLock; var glArgs = { preserveDrawingBuffer: true, failIfMajorPerformanceCaveat: true }; gl = canvas.getContext("webgl", glArgs) \|\| canvas.getContext("experimental-webgl", glArgs); if (!gl) { alert("Your browser does not supprt WebGL."); } } function initTriBuffer(data) { var triBuffer = gl.createBuffer(); gl.bindBuffer(gl.ARRAY_BUFFER, triBuffer); gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(data), gl.STATIC_DRAW); } function initProgram(vertID, fragID) { var fs = gl.createShader(gl.FRAGMENT_SHADER); var vs = gl.createShader(gl.VERTEX_SHADER); gl.shaderSource(fs, ele(fragID).text); gl.shaderSource(vs, ele(vertID).text); gl.compileShader(fs); gl.compileShader(vs); program = gl.createProgram(); gl.attachShader(program, vs); gl.attachShader(program, fs); gl.linkProgram(program); gl.useProgram(program); } function initGL() { initContext(); gl.viewport(0, 0, gl.drawingBufferWidth, gl.drawingBufferHeight); initTriBuffer([-1, -1, +1, -1, -1, +1, -1, +1, +1, -1, +1, +1]); } function setUniform(id, type, d1, d2, d3, d4) { var loc = gl.getUniformLocation(program, id); if (type[0] === "1") { gl["uniform" + type](loc, d1); } else if (type[0] === "2") { gl["uniform" + type](loc, d1, d2); } else if (type[0] === "3") { gl["uniform" + type](loc, d1, d2, d3); } else { gl["uniform" + type](loc, d1, d2, d3, d4); } } function setUniformMatrix(id, mat3) { var loc = gl.getUniformLocation(program, id); gl.uniformMatrix3fv(loc, false, mat3); } var time = 0.0, fps = 60, rate = 1000 / fps; var setupStage = -1; function setup() { if (setupStage === -1) { initContext(); } else if (setupStage === 0) { gl.viewport(0, 0, gl.drawingBufferWidth, gl.drawingBufferHeight); initTriBuffer([-1, -1, +1, -1, -1, +1, -1, +1, +1, -1, +1, +1]); } else if (setupStage === 1) { initProgram("vertex", "fragment"); } else if (setupStage === 2) { var positionLocation = gl.getAttribLocation(program, "a_position"); gl.enableVertexAttribArray(positionLocation); gl.vertexAttribPointer(positionLocation, 2, gl.FLOAT, false, 0, 0); } else if (setupStage === 3) { setUniform("scale", "2f", 2.0 / gl.drawingBufferWidth, 2.0 / gl.drawingBufferHeight); } } function draw() { if (setupStage < 5) { setup(); setupStage++; } else { setUniform("uTime", "1f", time / 2000); gl.drawArrays(gl.TRIANGLES, 0, 6); time += rate; } window.setTimeout(function() { window.requestAnimationFrame(draw); }, rate); } window.addEventListener("load", draw, false); </script> <script></script> </body> </html>
Folds
Fork	false
Key	ag5zfmtoYW4tYWNhZGVteXIXCxIKU2NyYXRjaHBhZBiAgJ2g1uj1Cgw
Votes	293
Spin-Offs	17
Type	WEBPAGE
Width	400
Height	600
User Flagged	false
Origin Scratchpad	null
Hidden From Hotlist	false
Restricted Posting	false
By Child	false
Author Nick	xacer
Author Name	xacer
Author ID	kaid_936620259368561719366955
Author Profile Access	PUBLIC

Archive Data

Added	10 months ago, 1739454028095
Updated	8 months ago, 1744844978142
Source Deleted	unknown