/* Functions : Math.pow(x,n) = x at power of n Math.abs(x) = absolute value of x Math.sqrt(x) = square root of x Math.PI = 3.1415 Math.random()*n = random number between 0 and n Math.round(x) Math.ceil(x) Math.floor(x) Math.cos(x) //cosine Math.sin(x) //sine Math.tan(x) //tangent (not normal) Operators: ^ XOR (bitwise) | OR (bitwise) & AND (bitwise) << left shift (bitwise) >> right shift (bitwise) (you can use pure javascript in input box, even alert("hi") but note that it'll get executed *"canvas.width" times…) Examples : f(x)= Math.pow(x,2) //hyperbola f(x)= x&10+20 //sawtooth waveform f(x)= if(x==40||x==-40){60}else if (x>40||x<-40){30}else{20} //heartbeat f(x)= pen.lineTo(0,x) //column f(x)= Math.sqrt(3000-Math.pow(x,2))@-Math.sqrt(3000-Math.pow(x,2))+5 //circle f(x)= pen.fillStyle=pen.strokeStyle;pen.fill();Math.sqrt(3000-Math.pow(x,2))@pen.fill();-Math.sqrt(3000-Math.pow(x,2))+5 //special circle f(x)= x+5@pen.strokeStyle="red";2*x+3@pen.strokeStyle="blue";Math.pow(x,2) //many equations f(x)= Math.sin((x-1)/6)*7@Math.cos(x/6)*7 //DNA bug: f(x)= x-y //scale Useful Variables : x (0 to canvas.width), pen (canvas 2D element), canvas (current canvas), xx (right-hand side of equation) Defaults : pen.lineWidth = 1.5 pen.lineCap = "rounded" (square|butt) pen.fillStyle = "black" pen.strokeStyle = "black" pen.lineJoin = "mitter" (round|bevel) Special Characters: ? <- keep canvas uncleared (draw over) @ <- draw another equation on same canvas */ var y, canvas, pen; window.onload = function() { canvas = document.getElementsByTagName("canvas")[0]; pen = canvas.getContext("2d"); pen.lineCap = "rounded"; pen.linejoin = "mitter"; pen.lineWidth = 1.5; pen.setTransform(2, 0, 0, 1, canvas.width / 2, 0); change(document.getElementsByTagName("input")[0]); }; function clr() { pen.clearRect(-canvas.width, -canvas.height, 2 * canvas.width, 2 * canvas.height); } function change(e) { xxx = e.value.split("@"); if (!xxx[0].match(/^\?/)) { clr(); }//ifpass xxx[0] = xxx[0].replace(/^\?/, ""); for (var stp = 0; stp < xxx.length; stp++) { chang(xxx[stp]); }//forstp }//change function chang(xx) { pen.beginPath(); for (var x = 0; x < canvas.width / 2; x += 0.08) { try { y = eval(xx.replace("x",x).replace("X","x")); } catch (e) { y = x; }//tryx if (x == 0) { pen.moveTo(x, canvas.height - y - canvas.height / 2); } else { pen.lineTo(x, canvas.height - y - canvas.height / 2); }//ifx }//forx for (x = 0; x > -canvas.width / 2; x -= 0.08) { try { y = eval(xx.replace("x",x).replace("X","x")); } catch (e) { y = x; }//tryx if (x == 0) { pen.moveTo(x, canvas.height - y - canvas.height / 2); } else { pen.lineTo(x, canvas.height - y - canvas.height / 2); }//ifx }//forx pen.stroke(); }//chang function expor() { if (!/iphone|ipad|android/gmi.test(navigator.userAgent)) { win = window.open("about:blank","_blank"); win.document.write("

"); win.document.getElementsByTagName("a")[0].click(); }//ifagent }//export

Equation Visualizer