Question

I have a round diagram for which I need to display a div when users hover over each section (arcs).

I was going to use canvas: http://www.html5canvastutorials.com/labs/html5-canvas-planets-image-map/
But I have not been able to draw an arc in canvas – or should I use any other technology to create this?

Answer 1

You can draw an arc in HTML5 Canvas, using either the arc() or arcTo() methods of the context.

You can see an example of arcs drawn in HTML5 Canvas in this little game I wrote:
http://phrogz.net/tmp/connections.html
The game concept is not mine, just the implementation.

Note that with a squared-off line cap style, you can even draw wedges (circle segments) with a single arc command.