Sign Up to our social questions and Answers Engine to ask questions, answer people’s questions, and connect with other people.
Login to our social questions & Answers Engine to ask questions answer people’s questions & connect with other people.
Lost your password? Please enter your email address. You will receive a link and will create a new password via email.
Please briefly explain why you feel this question should be reported.
Please briefly explain why you feel this answer should be reported.
Please briefly explain why you feel this user should be reported.
I created a circle using canvas and divided it into lines. I want the coordinate of a particular area: if I click a particular area, that alone should be clickable.
Take an example of a word wheel game where a circle is divided into many areas with different coordinates and some letters placed inside the divided areas. If I want to click the particular area with the letter ‘A’, the ‘A’ should be clicked and should be displayed in a text box.
How do I accomplish this?
The elements that form a canvas are not remembered and, thus, are not interactive – as soon as you commit them to the canvas, they are subsumed into the collective. They’re not individual elements like DOM elements.
The workaround is to remember the positions of things yourself, listen for clicks to the canvas element, then work out via your own logic what the click landed on.
This is non-trivial. Libraries like Kinetic make it easy. Working with an API such as this will save you a lot of time – like using jQuery for the DOM over vanilla JS.