Canvas 使用切点绘制圆弧 · Canvas动画教程

Cp0 使用切点绘制圆弧

arcTo()介绍

arcTo()方法接收5个参数，分别是两个切点的坐标和圆弧半径。这个方法是依据切线画弧线，即由两个切线确定一条弧线。 具体如下。

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

这个函数以给定的半径绘制一条弧线，圆弧的起点与当前路径的位置到(x1, y1)点的直线相切，圆弧的终点与(x1, y1)点到(x2, y2)的直线相切。因此其通常配合moveTo()或lineTo()使用。其能力是可以被更为简单的arc()替代的，其复杂就复杂在绘制方法上使用了切点。

使用切点绘制弧线

下面的案例我把切线也绘制出来了，看的更清楚一些。

    
    
    
        body { background: url("./images/bg3.jpg") repeat; }
        #canvas { border: 1px solid #aaaaaa; display: block; margin: 50px auto; }
    



    
        你的浏览器居然不支持Canvas？！赶快换一个吧！！
    					
										


					

						
欢迎分享，转载请注明来源：内存溢出
原文地址: http://outofmemory.cn/zaji/3013139.html