如何用canvas制作动画

canvas制作动画方法如下:工具/材料 dw等代码编辑工具
操作方法 01 先在HTML5页面主体里面添加一个<canvas>标签, 定义一张画布(大小, 背景颜色)代码
在头部嵌入JS代码, 并把画布加载到页当中去, 代码如图

如何用canvas制作动画

文章插图

02 在(900, 400)半径为30, 起点为0的地方, 逆时针画一个圆如图

如何用canvas制作动画

文章插图

03 运行程序, 如图

如何用canvas制作动画

文章插图

04 创建一个定时函数, 时数为50秒如图

如何用canvas制作动画

文章插图

05 创建两个变量(speed ,start)一个间歇函数, 设置速度和开始时间如图

如何用canvas制作动画

文章插图

06 以球体运行的开始坐标(start)到终点坐标画一个圆如图

如何用canvas制作动画

文章插图

07 运行程序, 结果你会发现如图

如何用canvas制作动画

文章插图

08 【如何用canvas制作动画】小球从右边移动到左边来了, 结果如图

如何用canvas制作动画

文章插图



以上内容就是如何用canvas制作动画的内容啦, 希望对你有所帮助哦!

    推荐阅读