Canvas制作的下雨动画的示例

简介 在codepen上看到一个Canvas做的下雨效果动画,感觉蛮有意思的。就研究了下,这里来分享下,实现技巧。 效果截图: Canvas动画基础 大家都知道,Canvas其实只是一个画板。我们可以应用canvas的api在上面绘制各种图形。 Canvas 2D 的API:https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D 那么Canvas绘制动画的步骤就是: 绘制第一帧图形(利用API绘图) 清空画板(应用clearRect()或fillRect()) 绘制下一帧动画