Hi. I've managed to make an image rotate on my canvas. And I've managed to make an image move along the canvas. My problem now is making it do both. I have got it working but I seems a bit like a hack. I've posted a demo online Here's the code.

var cnv = document.getElementById("drawing");

var c = cnv.getContext('2d');

var image = new Image(); image.src = 'images/spaceship.png';

var imgWidth = image.width; var imgHeight = image.height;

var i=0;

function animate() { c.clearRect(0,0,640,480); c.save(); c.translate(-(imgWidth/2)+i,200); c.rotate(i * Math.PI/180); c.translate(-(imgWidth/2),-(imgHeight/2)); c.drawImage(image, 0, 0); c.restore(); (i==640+imgWidth) ? i=0: i+=2; };

setInterval(animate, 1);

I think my problem is I'm not understanding the translate() method properly. Is this the correct way to do it or am I competely way off?