HTML DOM arcTo() 方法

定义和用法

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

语法

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

参数

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

描述

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

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

实例

可以用下面的代码绘制一个矩形的右上角(圆角):

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

提示和注释

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

参阅

CanvasRenderingContext2D.arc()