圆弧路径的圆心在 (x, y) 位置,半径为 r ,根据 anticlockwise (默认为顺时针)指定的方向从 startAngle 开始绘制,到 endAngle 结束。...start:开始角度,0度为水平向右
end:结束角度
bool:是否逆时针绘制图形
示例代码如下所示:
// 获得元素对象
var canvas = document.querySelector('...具体的思路如下:
定义DOM对象变量:获取画布、增减线条粗细的按钮、颜色控件、显示线条粗细值、清除按钮
然后定义一些变量值:初始化线条粗细的长度、鼠标是否按下的状态、线条颜色的默认值、颜色变量、鼠标的位置...x,y 变量
然后我们定义画圆形、画直线的相关方法:drawCircle(x,y)、drawLine(x1,y1,x2,y2)
接着在画布上定义监听 mousedown 的方法,初始化鼠标位置的X,Y的值...x,y值,先以线条的宽度绘制圆形,然后以鼠标按下时的 x,y 的值为直线的起点,鼠标移动时获取鼠标的 x,y 值为终点绘制直线。