getBoundingClientRect is not a function

Question

I am trying to get the coordinates of the mouse-click on a image. So I'm using getBoundingClientRect like this

function showCoords(canvas, event) {
    var rect = canvas.getBoundingClientRect();
    var x = event.clientX - rect.left;
    var y = event.clientY - rect.top;
    console.log("x: " + x + " y: " + y);
}

But I get this error "canvas.getBoundingClientRect is not a function"

Answer 1

That means that canvas variable is not actually a Canvas element.

It can be undefined, still not initialized or incorrectly selected.

You need to double check it and maybe try to use event.target if the click event is added to the canvas element.