How to detect point on canvas after canvas rotation in HTML5


Whenever we work with canvas and want the canvas to be rotated, we need to translate point to draw point as per its rotation.

A transform class can be made to detect point on the canvas after canvas rotation

var t = new Transform();
console.log(t.transformPoint(5,6)); //Transform point will be [5,6]

t.rotate(1); // Same transformations can be applied that we did to the canvas
console.log(t.transformPoint(5,6)); // Transformed point will be [-2.347, 7.449]

Updated on: 30-Jan-2020

189 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements