html5使用帆布画空心圆与实心圆的方法

  介绍

小编给大家分享一下html5使用帆布画空心圆与实心圆的方法,希望大家阅读完这篇文章后大所收获、下面让我们一起去探讨吧!

这里给大家分享的是一个学习画布的时候做的画空心圆与实心圆的练习题,非常简单。

& lt;帆布id=癱anvas"宽度=?00”;身高=?00”;风格=氨尘把丈?黄色;“祝辞& lt;/canvas> var帆布=. getelementbyid (“canvas");   var cxt=canvas.getContext (“2 d");//画一个空心圆   cxt.beginPath ();   cxt.arc(200200、50、0360、虚假);   cxt.lineWidth=5;   cxt.strokeStyle=癵reen";   cxt.stroke();//画空心圆   cxt.closePath ();//画一个实心圆   cxt.beginPath ();   cxt.arc(200100、50、0360、虚假);   cxt.fillStyle=皉ed"//填充颜色,默认是黑色   cxt.fill();//画实心圆   cxt.closePath ();//空心和实心的组合   cxt.beginPath ();   cxt.arc(300300、50、0360、虚假);   cxt.fillStyle=皉ed";   cxt.fill ();   cxt.strokeStyle=癵reen";   cxt.stroke ();   cxt.closePath ();

看完了这篇文章,相信你对html5使用帆布画空心圆与实心圆的方法有了一定的了解,想了解更多相关知识,欢迎关注行业资讯频道,感谢各位的阅读!

html5使用帆布画空心圆与实心圆的方法