In google chrome, getBoundingClientRect().x is undefined

Question

I\'m performing drawing operations on canvas. The best way to calculate cursor position relative to canvase top left corner is, in my opinion, usage of .getBoundingCli

Answer 1

The object returned by getBoundingClientRect() may have x and y properties in some browsers, but not all. It always has left, top, right, and bottom properties.

I recommend using the MDN docs instead of any W3C specs when you want to know what browsers actually implement. See the MDN docs for getBoundingClientRect() for more accurate information on this function.

So all you need to do is change your rect.x and rect.y to rect.left and rect.top.