modifying the polygraph on a canvas is not working when canvas image is scrolled

The current issue I am having is that when I scroll the image on the canvas the ability to manipulate the drawn polygraph is lost. Is there some way to address this in the code?

In the following and it is related to a post I put up in Validate if mouse position is within rotated rectangle in HTML5 Canvas and got help from Helder Sepulveda.

1 answer

  • answered 2021-09-11 18:44 Benjaco

    You are using event.clientY and event.clientX to get the position of the mouse, those 2 properties is relative to the screen.

    You can either use event.pageY and event.pageX to get the coordinates relative to the document (those 2 properties are not effected by scroll) Or offset the positions your self with window.scrollY and window.scrollX, an example of that can be seen here (important part event.clientY - canvas.offsetTop + window.scrollY)

How many English words
do you know?
Test your English vocabulary size, and measure
how many words do you know
Online Test
Powered by Examplum