Question

I need to rotate an image before loading it into a canvas.
As far as I know, I cant rotate it using the canvas.rotate(), since that rotates the entire scene.

Is there a good JS way to rotate an image? [not the browser dependent ways]

Answer 1

not exactly, you can save the scene, rotate image then restore scene:

var canvas = document.getElementById('canvas');
canvas.width = 600; 
canvas.height = 400; 
var ctx = canvas.getContext('2d'); 
var image = new Image();
image.src = 'https://www.google.ro/images/srpr/logo3w.png';
drawRotatedImage(image, 275, 95, 25); 

function drawRotatedImage(image, x, y, angle) { 
    ctx.save(); 
    ctx.translate(x, y);
    ctx.rotate(angle * (Math.PI/180));
    ctx.drawImage(image, -(image.width/2), -(image.height/2));
    ctx.restore(); 
}

JSFiddle Example