Returning un-transformed mouse coordinates after rotating an object on html5 canvas

There is an even more elegant way to solve this problem than the way you did, but you need to know how to do matrix multiplication to understand it.

You can use context.currentTransform to get the transformation matrix of the canvas. This matrix represents all the coordinate modifications resulting from all scale- translate- and rotate modifiers currently applied to the context state. Here is the documentation of the matrix.

To convert internal coordinates to screen coordinates, use these formulas:

screen_X = internal_X * a + internal_Y * c + e;    
screen_Y = internal_X * b + internal_Y * d + f;

Embarrassingly I solved this problem straight after asking the question.

In case anyone else needs the same sort of function, here is how I did it:

getTransformedCoords : function(coords){
    var self = this;
    var obj = self.activeObj;
    var angle = (obj.angle*-1) * Math.PI / 180;   
    var x2 = coords.x - obj.left;
    var y2 = coords.y - obj.top;
    var cos = Math.cos(angle);
    var sin = Math.sin(angle);

    var newx = x2*cos - y2*sin + obj.left; 
    var newy = x2*sin + y2*cos + obj.top;

    return {
        x : newx,
        y : newy
    };
},

I was also searching for this kind of query for a quite a bit of time. In my case, I was experimenting in canvas to display a dot point, when user mouse-click over the canvas, even after rotation. The issue was, after context rotation the points where wrongly displayed. I took the method provided by gordyr .

I have modified the code slightly for my code base. I have put my complete code base here.

let model = {
    ctx: {},
    canvas: {},
    width: 500,
    height: 500,
    angleInRad: 0
};
function getTransformedCoords(coords) {
    var angle = (model.angleInRad * -1);
    var x2 = coords.x;
    var y2 = coords.y;
    var cos = Math.cos(angle);
    var sin = Math.sin(angle);

    var newx = Math.floor(x2 * cos - y2 * sin);
    var newy = Math.floor(x2 * sin + y2 * cos);

    return new Position(newx, newy);
}

Once again thank you gordyr for your code.