1

I have drawn the circle and separated the 6 equal quadrants using HTML 5 Canvas,

I have to make every quadrant clickable, when its clicked it has to rotate it and also needs to redirect to another page and make sure the clicked quadrant need to be set as a active state and the clicked quadrant move and need to set in different position.

Please kindly help me to solve this issue.

Thanks in advance.

  • Please check this [link](http://jsfiddle.net/Fx4dF/9/) for what I've done so far. –  Jan 31 '13 at 06:13

1 Answers1

0

At first register a click event on the canvas,

At the event callback find the coordinate of click event

cordinate_x = event.offsetX;
cordinate_y = event.offsetY;

then find from which quadrants the coordinate belongs

redraw that quadrants,

then find how much rotation your canvas need, apply that much rotation and redirect to another page which belongs to that quadrant..

try it, ask for any further help..

all the best.

Scarecrow
  • 4,057
  • 3
  • 30
  • 56
  • Hi, Thank you for your response. I have created the circle and divided the quadrant as like the following link. [link](http://jsfiddle.net/Fx4dF/13/) . I am newbie to HTML5, so I couldn't understand, how to do it, the things you've mentioned. Can you please help me? –  Feb 07 '13 at 05:20
  • are you able to find the quadrant in which the click event occurred ? – Scarecrow Feb 07 '13 at 08:54