Hi, I'm having some issues wile adding rotation to the canvas image. This is the code I'm using but after I rotate the image on a mobile device, it freezes after the rotation happens. What would be the best way to implement that into your script?
On the mobile device I'm presenting two buttons to rotate the image (right or left)
var canvas = document.getElementById('canvas'),
context = canvas.getContext("2d"),
image = "temp.png";
function drawRotated(degrees){
context.clearRect(0, 0, canvas.width, canvas.height);
// save the unrotated context of the canvas so we can restore it later
// the alternative is to untranslate & unrotate after drawing
context.save();
// move to the center of the canvas
context.translate(canvas.width / 2, canvas.height / 2);
// rotate the canvas to the specified degrees
context.rotate(degrees * Math.PI / 180);
// draw the image
// since the context is rotated, the image will be rotated also
context.drawImage(image,-image.width / 2, -image.width / 2);
// we’re done with the rotating so restore the unrotated context
context.restore();
}
Hi, I'm having some issues wile adding rotation to the canvas image. This is the code I'm using but after I rotate the image on a mobile device, it freezes after the rotation happens. What would be the best way to implement that into your script?
On the mobile device I'm presenting two buttons to rotate the image (right or left)
thanks for your help in advance! Alvin.