Skip to content

Instantly share code, notes, and snippets.

@sbussard
Created February 27, 2011 20:49
Show Gist options
  • Save sbussard/846525 to your computer and use it in GitHub Desktop.
Save sbussard/846525 to your computer and use it in GitHub Desktop.
animated plotter where i is the parameter
var sin = Math.sin;
var cos = Math.cos;
var tan = Math.tan;
var ln = Math.log;
var log = Math.LOG10E;
var pi = Math.PI;
var wi,hi;
var n;
onmessage = function (event) {
if(typeof(event.data) == 'number')
{
n = event.data; // higher number = higher quality
var p = [];
d = new Date();
i = (d.getTime())/pi/1000;
var a = -100*pi;
var b = 100*pi;
var dx = (b-a)/(pi*n);
limits = [a,b];
var j = 0;
for(var x = 0; x < (b-a); x+=dx) {
p[j++] = transform([f(x+a),g(x+a)]);
}
postMessage(p);
} else {
wi = event.data[0];
hi = event.data[1];
}
}
function transform(p) {
x = wi/2 + p[0] + 0.5;
y = hi/2 - p[1] + 0.5;
return [x,y];
}
function f(x) {
var xi = x + i;
return (cos(xi/100)+cos(x))*hi/4;
}
function g(x) {
var xi = x + i;
return (sin(x/100)*sin(xi))*hi/4;
}
<!DOCTYPE html>
<html>
<title>Worker</title>
<style type="text/css">
html, body {
padding: 10px;
margin: 0;
}
</style>
<body>
<script type="text/javascript">
var w = new Worker('cruncher.js');
var wi,hi;
var context;
init();
function init() {
var canvas = document.createElement('canvas');
canvas.height = hi = window.innerHeight-50;
canvas.width = wi = window.innerWidth-50;
w.postMessage([wi,hi]);
document.body.appendChild(canvas);
context = canvas.getContext('2d');
context.strokeStyle = "rgb(50,100,55)";
w.postMessage(10000);
}
w.onmessage = function (event) {
var p = event.data;
p[p.length] = p[p.length-1];
context.save();
context.clearRect(0,0,wi,hi);
context.beginPath();
for(var i = 0; i < p.length; i++) {
var p1 = p[i];
var p2 = (p[i+1])?p[i+1]:p1;
context.moveTo(p1[0],p1[1]);
context.lineTo(p2[0],p2[1]);
}
context.stroke();
context.restore();
w.postMessage(10000);
}
</script>
</body>
</html>
@sbussard
Copy link
Author

I like this one: //hi < wi usually

function f(x) {
    var xi = x + i;
    return (cos(x/100)*cos(x)+sin(xi))*hi/4;
}

function g(x) {
    var xi = x + i;
    return (sin(x/100)*sin(xi)+cos(xi))*hi/4;
}

@sbussard
Copy link
Author

neat thing

function f(x) {
    var xi = x + i;
    var result = sin(x/100)*.1+cos(xi/10)*.4+cos(x/2)*.2;
    return result*hi*4/7;
}

function g(x) {
    var xi = x + i;
    var result = cos(x/100)*.1+sin(xi/10)*.4+sin(x/2)*.2;
    return result*hi*4/7;

}

@esromneb
Copy link

This is so legit!

@sbussard
Copy link
Author

thanks!

@esromneb
Copy link

Do you also have a gist for the most recent eye candy at http://stephenbussard.com/ ?

@sbussard
Copy link
Author

@sbussard
Copy link
Author

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment