How to draw a circle sector on an html5 canvas?

Question

I'm trying to make a sort of pie-chart shape on a canvas element, however I can't seem to find any function that does this by itself. I only seem to be able to draw full circles and segments. Is there an easy way to do this?

(See also: Wikipedia on circle terminology)

Overby

Answer 1

The following should work:

context.moveTo(cx,cy);
context.arc(cx,cy,radius,startangle,endangle);
context.lineTo(cx,cy);
context.stroke(); // or context.fill()

with cx, cy being the center of the arc.

Schuler

Martin has the right idea, here's a working example if you're really lost: jsfiddle.net/3VB68 – Suggestion

Just a FYI, angles are in radians here. – Tomasz

What about context.beginPath() / context.closePath() ? Some stuff like clearRect() will stop working without them – Shaunda