<canvas id="canvas1" width=300 height=300></canvas>
<script type="text/javascript">
var canvas = document.getElementById("canvas1");
var context1 = canvas.getContext("2d");
var x = 0.0;
var rot = 0.0;
function rotateRect() {
context1.clearRect(0, 0, canvas1.width, canvas1.height);
context1.save();
context1.translate(x, 100);
context1.rotate(Math.PI/4.0*rot);
context1.fillStyle = "rgb(0, 255, 0)";
context1.translate(-25, -25);
context1.fillRect(0, 0, 50, 50);
context1.restore();
rot += 0.1;
x += 0.3;
if(x > canvas1.width) {
x = 0.0;
}
}
setInterval(rotateRect, 10);
</script>