画布绘制效果

Question

我开始编写一些从简单到复杂的画布脚本。我想画一个圆圈。这很简单。问题是圆圈是立即绘制的。如果我想让圆圈慢慢变大怎么办（让我们说从一条垂直线到一个半圆，到一个半圆，再到一个完整的圆）画布中有什么方法可以做到这一点（本机）还是我需要做一个可以（快速）建立和删除几个圆圈来模拟效果的函数？

如果后者是真的，我应该注意哪些性能问题？

谢谢！

Answer 1

使用画布的任何形式的动画都需要清除画布并制作序列中的下一个绘图。 Mozilla 开发网络有一个很好的关于画布和画布动画的教程。

Answer 2

查看animate.js 库。它正是您所需要的。用法同jQueryUI。

你需要的可以通过下面这段代码来完成：

canvas_element.animateCircle(x,y,r);

还有其他可选参数，例如animateCircle(x,y,r,{'lineWidth':5, 'lineColour':'red', 'stop': function() {alert('completed');}}) 和其他一些功能。详情请查看自述文件。