小程序canvas画虚线圆

约定不等于承诺〃 2021-12-11 13:13 506阅读 0赞

效果：

watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTIwMTEzNjA_size_16_color_FFFFFF_t_70

封装：

/**

* 画虚线园

* cxt_arc 画布

* thex 画的x坐标

* they 画的y坐标

* raduis 圆半径

* space 虚线的间隔 默认值 2 * Math.PI / 100 即一百空白点

*/

drawDashCircle: function (cxt_arc, thex, they, raduis, space) {

space = space || 2 * Math.PI / 100;

cxt_arc.setLineWidth(1);

cxt_arc.setStrokeStyle(“rgba(134,181,162,0.5)”);

cxt_arc.setLineCap(‘square’)

var start = 0;//从原点开始画

while (start <= 2 * Math.PI) {

var end = start + space;

cxt_arc.beginPath();//开始一个新的路径

cxt_arc.arc(thex, they, raduis, start, end, false);

start = space + end;

cxt_arc.stroke();//对当前路径进行描边

}

},

使用：

this.drawDashCircle(ctx, 200, 200, 60);

发表评论

表情：
评论列表 （有 0 条评论，506人围观）

还没有评论，来说两句吧...

相关阅读