JS1k, the yearly JS code golfing competition

JS1k: The JavaScript code golfing competition

2013 - Spring!

Home   Rules   Demos   Submit

Math Graphs

t draw 2d mathematical function. It has pan and zoom functionality. Functions can be complex and include sin, cos, tan, cot and power.

Author:
Mohsen Azimi
Twitter:
@
GitHub:
Facebook:
Google+:
+
Reddit:
/r/
Pouet:
Website: 
mohsenweb.com
Compo:
classic
Demo link:
https://js1k.com/2013-spring/demo/1426
Shortlink:
https://js1k.com/1426
Blog post:
please update here!
Bytes:
998
Chars:
998
Submission
Number.prototype.pow=function(n){return Math.pow(this,n)};function C(u){return document.createElement(u)}z=50;d=C("div");i=C("input");i.value="x*sin(x^2)";d.innerHTML="f(x)=";B="appendChild";d[B](i);b[B](d);i.onkeyup=p;c.onmousewheel=function(e){z+=e.wheelDelta/10;p();return!1};c.onmousedown=function(e){L=e.pageX-dx;K=e.pageY-dy;c.onmousemove=P};b.onmouseup=function(e){c.onmousemove=0};dx=0;dy=0;function P(e){dx=e.pageX-L;dy=e.pageY-K;p()}function o(f){W=c.width=c.height=500;w=h=W/2;w+=dx;h+=dy;M="moveTo";I="lineTo";B="beginPath";S="stroke";a.strokeStyle="#EFF";a[B]();for(x=1;x<W;x+=10){a[M](x,0);a[I](x,W);a[M](0,x);a[I](W,x)}a[S]();a.strokeStyle="black";a[B]();a[M](0,h);a[I](W,h);a[M](w,0);a[I](w,W);a[S]();a.strokeStyle="red";a[B]();for(x=-w;x++<W*10;){a[I](x+w,-z*f(x/z)+h)}a[S]()}function p(){try{o(new Function("x","return "+i.value.replace(/[\d|\d.\d]+|x/g,function(n){return"("+n+")"}).replace(/sin|cos|tan|cot/g,function(n){return"Math."+n}).replace(/\^/g,".pow")))}catch(e){}}p();
Description
t draw 2d mathematical function. It has pan and zoom functionality. Functions can be complex and include sin, cos, tan, cot and power.
Base64 encoded
TnVtYmVyLnByb3RvdHlwZS5wb3c9ZnVuY3Rpb24obil7cmV0dXJuIE1hdGgucG93KHRoaXMsbil9O2Z1bmN0aW9uIEModSl7cmV0dXJuIGRvY3VtZW50LmNyZWF0ZUVsZW1lbnQodSl9ej01MDtkPUMoImRpdiIpO2k9QygiaW5wdXQiKTtpLnZhbHVlPSJ4KnNpbih4XjIpIjtkLmlubmVySFRNTD0iZih4KT0iO0I9ImFwcGVuZENoaWxkIjtkW0JdKGkpO2JbQl0oZCk7aS5vbmtleXVwPXA7Yy5vbm1vdXNld2hlZWw9ZnVuY3Rpb24oZSl7eis9ZS53aGVlbERlbHRhLzEwO3AoKTtyZXR1cm4hMX07Yy5vbm1vdXNlZG93bj1mdW5jdGlvbihlKXtMPWUucGFnZVgtZHg7Sz1lLnBhZ2VZLWR5O2Mub25tb3VzZW1vdmU9UH07Yi5vbm1vdXNldXA9ZnVuY3Rpb24oZSl7Yy5vbm1vdXNlbW92ZT0wfTtkeD0wO2R5PTA7ZnVuY3Rpb24gUChlKXtkeD1lLnBhZ2VYLUw7ZHk9ZS5wYWdlWS1LO3AoKX1mdW5jdGlvbiBvKGYpe1c9Yy53aWR0aD1jLmhlaWdodD01MDA7dz1oPVcvMjt3Kz1keDtoKz1keTtNPSJtb3ZlVG8iO0k9ImxpbmVUbyI7Qj0iYmVnaW5QYXRoIjtTPSJzdHJva2UiO2Euc3Ryb2tlU3R5bGU9IiNFRkYiO2FbQl0oKTtmb3IoeD0xO3g8Vzt4Kz0xMCl7YVtNXSh4LDApO2FbSV0oeCxXKTthW01dKDAseCk7YVtJXShXLHgpfWFbU10oKTthLnN0cm9rZVN0eWxlPSJibGFjayI7YVtCXSgpO2FbTV0oMCxoKTthW0ldKFcsaCk7YVtNXSh3LDApO2FbSV0odyxXKTthW1NdKCk7YS5zdHJva2VTdHlsZT0icmVkIjthW0JdKCk7Zm9yKHg9LXc7eCsrPFcqMTA7KXthW0ldKHgrdywteipmKHgveikraCl9YVtTXSgpfWZ1bmN0aW9uIHAoKXt0cnl7byhuZXcgRnVuY3Rpb24oIngiLCJyZXR1cm4gIitpLnZhbHVlLnJlcGxhY2UoL1tcZHxcZC5cZF0rfHgvZyxmdW5jdGlvbihuKXtyZXR1cm4iKCIrbisiKSJ9KS5yZXBsYWNlKC9zaW58Y29zfHRhbnxjb3QvZyxmdW5jdGlvbihuKXtyZXR1cm4iTWF0aC4iK259KS5yZXBsYWNlKC9cXi9nLCIucG93IikpKX1jYXRjaChlKXt9fXAoKTs=
Original source
// Add pow method to number.
Number.prototype.pow = function(n){return Math.pow(this,n)}

// Shortcut for createElement
function C(u){
  return document.createElement(u)
}

// Make the form
z = 50;
d = C('div')
i = C('input')
i.value = 'x*sin(x^2)'//'50*sin(x/50)'
d.innerHTML = 'f(x)='

B = 'appendChild'

d[B](i)
b[B](d)

i.onkeyup = p

// Add listeners
c.onmousewheel =function(e){
  z+=e.wheelDelta/10;
  p()
  return !1
}

c.onmousedown = function(e){
  L = e.pageX - dx
  K = e.pageY - dy
  c.onmousemove = P
}
b.onmouseup = function(e){
  c.onmousemove=0
}

dx = 0;
dy = 0;

// Mouse move event handler
function P(e){
  dx = e.pageX - L
  dy = e.pageY - K
  p()
}

// Draw
function o(f){
  W = c.width = c.height = 500
  w = h = W/2;

  w += dx
  h += dy

  //draw mesh
  M = 'moveTo'
  I = 'lineTo'
  B = 'beginPath'
  S = 'stroke'

  a.strokeStyle = '#EFF'
  a[B]()
  for(x=1; x<W; x+=10){
    a[M](x,0) 
    a[I](x,W)
    a[M](0,x)
    a[I](W,x)
  }
  a[S]()



  a.strokeStyle = 'black'
  a[B]()
  a[M](0, h)
  a[I](W, h)
  a[M](w,0)
  a[I](w,W)
  a[S]()

  a.strokeStyle = 'red'
  a[B]()

  for(x=-w; x++<W*10;){
    a[I](x+w,-z*f(x/z)+h)
  }

  a[S]()
}


// Key up listener
function p(){
     try{
      o(new Function('x', 'return ' +
        i.value
        .replace(/[\d|\d.\d]+|x/g, function(n){
          return '(' + n + ')'
        })
        .replace(/sin|cos|tan|cot/g, function(n){
          return 'Math.' + n
        })
        .replace(/\^/g, '.pow')
      ))
    }catch(e){}
}

// Draw default formula
p()