我们通过学习如何使用mojs为HTML元素添加动画来开始本系列。在第二个教程中，我们继续使用Shape模块制作内置SVG形状的动画。第三个教程介绍了使用ShapeSwirl和stagger模块对SVG形状进行动画处理的更多方法。
现在，我们将学习如何使用Burst模块以突发形式制作不同SVG形状的动画。本教程将取决于我们在前三个教程中介绍的概念。如果您还没有阅读过它们，我建议您先阅读它们。
创建基本连拍动画
在创建任何突发动画之前，我们需要做的第一件事是实例化Burst对象。之后，我们可以指定不同属性的值来控制动画的播放方式。Burst模块中的许多属性名称与Shape模块中的属性名称相同。然而，在这种情况下，这些属性执行非常不同的任务。
left和right属性决定突发的初始位置，而不是突发内部的粒子。同样，x和y属性决定整个突发的移动而不是单个粒子的移动。
所有爆发粒子形成的圆的半径由radius属性控制。这与单个形状的radius属性非常不同，后者决定了这些形状的大小。在爆发的情况下，半径决定了其中各个形状的距离。
可以使用count属性指定单次突发中的形状或粒子数量。默认情况下，您创建的每个突发中将有五个粒子。所有这些粒子均匀分布在爆发的圆周上。例如，如果有四个粒子，它们将彼此成90度放置。如果有三个粒子，它们将被放置在120度处。
如果您不希望爆发粒子覆盖整个360度，您可以使用Degree 属性指定应覆盖的部分。任何大于0的值对此属性都有效。指定的度数将均匀分布在所有粒子之间。如果度数超过360，形状可能会重叠。
使用angle属性指定的角度决定了整个突发的角度。在这种情况下，单个粒子不是绕着它们自己的中心旋转，而是绕着爆发的中心旋转。这与地球绕太阳公转类似，与地球自转轴自转不同。
scale属性可缩放突发的所有物理属性的值，进而缩放各个形状。就像其他突发属性一样，其中的所有形状都会立即缩放。将突发scale设置为3会将整个突发的半径以及单个形状的大小增加3。
在下面的代码片段中，我们将使用刚刚讨论的属性创建五个不同的突发。
