![6a2f5a25fc09b40587c6ee41f419ccbd.png](https://i-blog.csdnimg.cn/blog_migrate/978ac09f2d4f89fb6e304c1d3c5760c3.jpeg)
上一篇文章我们使用Canvas绘制了动态屏保,重点讲了一下arc函数和requestAnimationFrame的应用。
这节课呢我们在加深一下arc和requestAnimationFrame,实现一个WiFi信号。效果图,如下:
![9bd1403e1c54be19d43f35d086d09502.png](https://i-blog.csdnimg.cn/blog_migrate/5ab462a832945fccef2fd8dfc0c29fa1.jpeg)
看到这个图,我们分析一下思路,我们分三步:
第一步,我们先画一个弧形;
第二步,我们画一组弧形;
第三,我们让一组弧形动起来。
我们一步步来,首先,我们先整一个html页面:
<!DOCTYPE html>
ok,我们搭好了架子,开始准备做基础工作,我们先复习一下上一篇文章写的arc函数,搞一个弧形出来,如图所示