HTML canvas arc() 方法
实例
创建一个圆:
JavaScript:
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.beginPath();
ctx.arc(100, 75, 50, 0, 2 * Math.PI);
ctx.stroke();
亲自试一试 »
浏览器支持
表中的数字表示完全支持该方法的第一个浏览器版本。
| 方法 | |||||
|---|---|---|---|---|---|
| arc() | 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
定义和用法
arc() 方法创建弧/曲线（用于创建圆或圆的一部分）。
提示： 使用 arc() 创建圆：将起始角度设置为 0，将结束角度设置为 2*Math.PI。
提示： 使用 stroke() 或 fill() 在画布上实际绘制圆弧的方法。
Center
arc(100, 75, 50, 0 * Math.PI, 1.5 * Math.PI)Start angle
arc(100, 75, 50, 0, 1.5 * Math.PI)End angle
arc(100, 75, 50, 0 * Math.PI, 1.5 * Math.PI)
| JavaScript 语法: | context.arc(x, y, r, sAngle, eAngle, counterclockwise); |
|---|
参数值
| 参数 | 描述 | Play it |
|---|---|---|
| x | 圆心的x坐标 | Play it » |
| y | 圆心的y坐标 | Play it » |
| r | 圆的半径 | Play it » |
| sAngle | 起始角度，单位为弧度（0为圆弧3点钟位置） | Play it » |
| eAngle | 结束角度，单位为弧度 | Play it » |
| counterclockwise | 可选。指定绘图应该是逆时针还是顺时针。 默认为false，表示顺时针，true表示逆时针。 | Play it » |
❮ Canvas 对象
