context.arc(centerX, centerY, radius, startingRadianAngle, endingRadianAngle)
给定中心点，半径以及起始和终止角度绘制圆弧。角度表示为弧度。要将度数转换为弧度，可以使用以下公式：。radians = degrees *Math.PI/ 180;
角度0直接从圆弧的中心向右。
默认情况下，弧是顺时针绘制的，可选的[true | false]参数指示弧是逆时针绘制的： context.arc(10,10,20,0,Math.PI*2,true)
<!doctype html>
<html>
<head>
<style>
body{ background-color:white; }
#canvas{border:1px solid red; }
</style>
<script>
window.onload=(function(){
// 获取对canvas元素及其上下文的引用
var canvas=document.getElementById("canvas");
var ctx=canvas.getContext("2d");
// 论点
var centerX=50;
var centerY=50;
var radius=30;
var startingRadianAngle=Math.PI*2*; // 从90度开始== centerY + radius
var endingRadianAngle=Math.PI*2*.75; // 终止于270度（以弧度为单位== PI * 2 * .75）
// A partial circle (i.e. arc) drawn using the "arc" command
ctx.beginPath();
ctx.arc(centerX, centerY, radius, startingRadianAngle, endingRadianAngle);
ctx.stroke();
}); // 结束window.onload
</script>
</head>
<body>
<canvas id="canvas" width=200 height=150></canvas>
</body>
</html>要绘制一个完整的圆，可以使EndingAngle = startingAngle + 360度（360度== Math.PI2）。
<!doctype html>
<html>
<head>
<style>
body{ background-color:white; }
#canvas{border:1px solid red; }
</style>
<script>
window.onload=(function(){
// 获取对canvas元素及其上下文的引用
var canvas=document.getElementById("canvas");
var ctx=canvas.getContext("2d");
// 论点
var centerX=50;
var centerY=50;
var radius=30;
var startingRadianAngle=0; // 从0度开始
var endingRadianAngle=Math.PI*2; // 以360度结束（== PI * 2以弧度表示）
// A complete circle drawn using the "arc" command
ctx.beginPath();
ctx.arc(centerX, centerY, radius, startingRadianAngle, endingRadianAngle);
ctx.stroke();
}); // 结束window.onload
</script>
</head>
<body>
<canvas id="canvas" width=200 height=150></canvas>
</body>
</html>