mirror of
https://github.com/TomHodson/tomhodson.github.com.git
synced 2025-06-26 10:01:18 +02:00
94 lines
2.2 KiB
HTML
94 lines
2.2 KiB
HTML
<html>
|
|
|
|
<canvas id="canvas"></canvas>
|
|
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
|
|
<script src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.3.3/underscore-min.js"></script>
|
|
<script type="text/javascript">
|
|
var canvas = $("#canvas")[0];
|
|
var context = canvas.getContext("2d");
|
|
canvas.width = innerWidth;
|
|
canvas.height = innerHeight * 3;
|
|
//draw
|
|
prettytiles();
|
|
|
|
|
|
function prettytiles() {
|
|
var box_width = 100;
|
|
var n_rows = Math.floor(canvas.width / box_width);
|
|
context.translate(box_width,box_width);
|
|
for (var i = 0; i < 100; i++) {
|
|
var x = (i%n_rows)*box_width;
|
|
var y = Math.floor(i / n_rows) * box_width;
|
|
|
|
context.translate(x,y);
|
|
context.scale(box_width/2, box_width/2);
|
|
factordiagram(primefactors(i+1)).draw();
|
|
context.scale(1/(box_width/2), 1/(box_width/2));
|
|
context.translate(-x,-y);
|
|
};
|
|
}
|
|
|
|
|
|
function factordiagram(factors) {
|
|
if(factors.length == 0) { //there are no factors left, we're at the bottom; draw a little dot
|
|
return {
|
|
draw: function() {
|
|
context.beginPath();
|
|
context.arc(0,0,1,0,2*Math.PI);
|
|
context.stroke();
|
|
context.fill();
|
|
},
|
|
width : 1,
|
|
height : 1
|
|
}
|
|
}
|
|
else {
|
|
var factor = factors.pop();
|
|
var subunit = factordiagram(factors);
|
|
return {
|
|
draw : function() {
|
|
var radius = 0.5;
|
|
var ang_step = 2*Math.PI/factor;
|
|
var scale = (2*Math.PI*radius) / (4*factor);
|
|
for (var i = 0; i < factor; i++) {
|
|
var x = radius * Math.sin(i * ang_step); var y = radius * Math.cos(i * ang_step);
|
|
context.translate(x,y);
|
|
context.scale(scale, scale);
|
|
if(factor == 2) context.rotate(Math.PI/2);
|
|
subunit.draw();
|
|
if(factor == 2) context.rotate(-Math.PI/2);
|
|
context.scale(1/scale, 1/scale);
|
|
context.translate(-x,-y);
|
|
|
|
};
|
|
}
|
|
|
|
}
|
|
}
|
|
}
|
|
|
|
function primesupto(x) {
|
|
notprimes = Array();
|
|
primes = Array();
|
|
for (var i = 2; i <= x; i++) {
|
|
if(notprimes.indexOf(i) == -1) {
|
|
primes.push(i);
|
|
notprimes = _.union(notprimes, _.range(0,x+1,i));
|
|
};
|
|
};
|
|
return primes;
|
|
}
|
|
|
|
function primefactors(x) {
|
|
if(x == 1) { return []; }
|
|
primes = primesupto(x);
|
|
for (var i = 0; i < primes.length; i++) {
|
|
if(x % primes[i] == 0) {
|
|
return [primes[i]].concat(primefactors(x/primes[i]));
|
|
}
|
|
};
|
|
}
|
|
|
|
</script>
|
|
</html> |