# Graphics Card Fractal Rendering Demo

Er, JavaScript or WebGL doesn't seem to be running, so basically all you're going to see is the bare code...

 /* Mandelbrot Set fractal. We start with two complex numbers: c is a constant, giving your location. z starts at c, and we'll iterate it. */ float cr=texcoords.x, ci=texcoords.y; float zr=cr, zi=ci; float mag=0.0; /* Mandelbrot Set fractal iteration: */ for (int a=0;a<50;a++) { // complex magnitude mag=zr*zr+zi*zi; if (mag>4.0) break; // complex multiply: n=z*z float nr = zr*zr - zi*zi; float ni = 2.0*zr*zi; // z=n+c zr = nr + cr; zi = ni + ci; } // Colorize according to the final z return vec3( /* red: */ fract(0.2*time+zr*0.5), /* green: */ fract(0.13*time+zi*0.5), /* blue: */ mag/16.0 ); // Make a shader to render to the screen: sim.shader = new THREE.ShaderMaterial( { uniforms: { time: { type: "f", value: 0.0 }, }, vertexShader: "varying vec2 texcoords;\n"+ "varying vec3 world;\n"+ "void main() { \n"+ " world=position;\n"+ " texcoords = uv; // <- from THREE.js vertex attr \n"+ " gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );\n"+ "}\n" , fragmentShader: "varying vec2 texcoords;\n"+ "varying vec3 world;\n"+ "uniform float time;\n"+ "vec3 run(vec2 texcoords) {\n"+ // gpu1D-inspired interface PixAnvil.loadTab("Fractal")+ " return vec3(1,0,1);\n"+ "}\n"+ "void main() { \n"+ " gl_FragColor=vec4(run(world.xy),1.0); \n"+ "}\n" } ); var cubeShow = new THREE.CubeGeometry( 10,10,0.001); var quadShow = new THREE.Mesh( cubeShow, sim.shader); quadShow.position.set(0,0,0); scene.add( quadShow ); // Set near and far clipping planes on camera camera.near=1.0e-6; camera.far=1.0e+3; camera.updateProjectionMatrix(); // Update uniform variables sim.shader.uniforms.time.value=lib.time; // Camera control: // Update camera coordinate system var s=camera; if (!s.X) { // startup: create initial coordinates s.X=new vec3(1,0,0); s.Y=new vec3(0,1,0); s.Z=new vec3(0,0,1); // camera Z is world -Z s.P=new vec3(-0.5,0,2.3); // initial location } // Move camera via keyboard var move=new vec3(0,0,0); // sums current frame motion // X control via A and D if (lib.key['a']) move.pe(new vec3(-1,0,0)); if (lib.key['d']) move.pe(new vec3(+1,0,0)); // Y control via W and S if (lib.key['w']) move.pe(new vec3(0,+1,0)); if (lib.key['s']) move.pe(new vec3(0,-1,0)); // Z control via Q and Z if (lib.key['q']) move.pe(new vec3(0,0,+1)); if (lib.key['z']) move.pe(new vec3(0,0,-1)); var speed=1.0; move.te(speed*s.P.z*lib.dt); // lower==slower s.P.pe(s.X.t(move.x).p(s.Y.t(move.y)).p(s.Z.t(move.z))); // Rotate camera via mouse var speed=0.01; // radians per mouse pixel if (lib.mouseleft) { // move Z with mouse s.Z.pe(s.X.t(-lib.mousedx*speed).p( s.Y.t( lib.mousedy*speed))); } // Orthonormalize s.X.crossVectors(s.Y,s.Z).normalize(); s.Y.crossVectors(s.Z,s.X).normalize(); s.Z.normalize(); // Write coordinate system into camera matrix s.matrixAutoUpdate=false; // don't trash s.matrixWorldNeedsUpdate=true; // show var m=s.matrix; // the camera's matrix // Utility function: set a matrix column function setCol(m,col,vec) { m.elements[4*col+0]=vec.x; m.elements[4*col+1]=vec.y; m.elements[4*col+2]=vec.z; } setCol(m,0,s.X); setCol(m,1,s.Y); setCol(m,2,s.Z); setCol(m,3,s.P); // position from camera sim