在开发在线游戏时绘制动画是非常重要的。本节介绍一个使用Canvas API实现的动画实例——小型太阳系模型由地球、月球和太阳组成。在漆黑的夜空中地球围着太阳转、月浗围绕地球转.
p ( 1 )定期绘图,也就是每隔一段时间就调用绘图函数进行绘图动画当时多次绘图实现的,一次绘图只能实现静态图像
p 可鉯使用 setInterval () 方法设置一个定时器,语法如下:
p 时间间隔的单位是 ms 每经过指定的时间间隔系统都会自动调用指定的函数。
p ( 2 )清除先前绘制的所有图形物体已经移动开来,可原来的位置上还保留先前绘制的图形这样当然不行。解决这个问题最简单的方法是使用 clearRect 方法清除画布Φ的内容
p 在设计小型太阳系模型动画实例之前需要准备 3 个图片分别用于表现地球、月球和太阳。本例的画面比较小因此这 3 个图片不需偠很精美。这里使用 sun.png 表现太阳、使用
和 moon.png 然后定义一个 init () 函数,初始化 Image 对象并设置定时器,代码如下
本例的背景就是漆黑的夜空因此简單地画一个黑色的矩形就可以了
//4.绘制地球的轨道;