<script> window.onload = function() { var canvas = document.getElementById("myCanvas"); var context = canvas.getContext("2d"); var image1 = new Image(); image1.src = "img/foot.png"; var image2 = new Image(); image2.src = "img/patty.png"; image1.onload = function() { for (var i=0; i<100; i++) { context.save(); context.translate(canvas.width/2, canvas.height/2); context.rotate(Math.PI*2*i/100); context.drawImage(image1, 0, 0); context.restore(); } } image2.onload = function() { for (var i=0; i<10; i++) { context.save(); context.translate(canvas.width/2, canvas.height/2); context.rotate(Math.PI*2*i/10); context.drawImage(image2, 50, 50); context.restore(); } } } </script>