数据可视化基础 - canvas基础篇(三):绘制弧线与圆形

107 阅读1分钟

内容整理承接:

《数据可视化基础 - canvas基础篇(二):# 填充/清除,与绘制矩形》

2.4 绘制圆形(arc)

arc() 方法创建弧/曲线(用于创建圆或部分圆)。

语法:ctx.arc(x,y,r,sAngle,eAngle,counterclockwise);

x,y:圆心坐标;

r:半径大小;

sAngle:绘制开始的角度; 圆心到最右边点是 0 度,顺时针方向弧度增大。

eAngel:结束的角度,注意是弧度π ;

counterclockwise:是否是逆时针。true 是逆时针,false:顺时针;

弧度和角度的转换公式:rad = deg*Math.PI/180;

在 Math 提供的方法中sin、cos 等都使用的弧度。