Convert skew to HTML5 canvas
I'm trying to implement a skew transformation using the "x" axis with an HTML5 canvas, but my code doesn't work ... Here is my JavaScript:
function init() {
var canvas = document.getElementById('skewTest'),
context = canvas.getContext('2d'),
angle = Math.PI / 4;
img = document.createElement('img');
img.src = 'img.gif';
img.onload = function () {
context.setTransform(1, Math.tan(angle), 1, 1, 0, 0);
context.clearRect(0, 0, 200, 200);
context.drawImage(img, 0, 0, 100, 100);
}
}
I will be very happy to see a working example in the JsFiddle.
Thank you in advance!
+3
user551761
source
to share