HTML DOM arcTo() 方法

定义和用法

arcTo() 方法使用使用切点和一个半径，来为当前子路径添加一条圆弧。

语法

  1. arcTo(x1, y1, x2, y2, radius)

参数

参数 描述
x1, y1 点 P1 的坐标。
x2, y2 点 P2 的坐标。
radius 定义圆弧的圆的半径。

描述

这个方法为当前的子路径添加了一条圆弧，但是，它所描述的这条圆弧和 arc() 方法所描述的圆弧大不相同。添加给路径的圆弧是具有指定 radius 的圆的一部分。该圆弧有一个点与当前位置到 P1 的线段相切，还有一个点和从 P1 到 P2 的线段相切。这两个切点就是圆弧的起点和终点，圆弧绘制的方向就是连接这两个点的最短圆弧的方向。

在很多常见的应用中，圆弧开始于当前位置而结束于 P2，但情况并不总是这样。如果当前的位置和圆弧的起点不同，这个方法添加了一条从当前位置到圆弧起点的直线。这个方法总是将当前位置设置为圆弧的终点。

实例

可以用下面的代码绘制一个矩形的右上角（圆角）：

  1. c.moveTo(10,10);        //在左上方开始
  2. c.lineTo(90,10);        //到达圆角开始点的水平线
  3. c.arcTo(100,10,100,20,10);    //圆角
  4. c.lineTo(100,100);        //到达右下方的垂直线

提示和注释

注释：这个方法在 Firefox 1.5 中未实现。

参阅

CanvasRenderingContext2D.arc()