canvas教程

玩转html5lt;canvasgt;画图(5)

字号+ 作者:H5之家 来源:H5之家 2016-11-28 15:00 我要评论( )

在canvas中绘出的图片只是canvas标签而已,并非是真正的图片,是不能右键,另存为的,我们可以利用canvas.toDataURL()这个方法把canvas绘制的图形生成一幅图片,生成图片后,就能对图片进行相应的操作了。 结合setI

      在canvas中绘出的图片只是canvas标签而已,并非是真正的图片,是不能右键,另存为的,我们可以利用canvas.toDataURL()这个方法把canvas绘制的图形生成一幅图片,生成图片后,就能对图片进行相应的操作了。

itdadao

结合setInterval制作动画

      基本原理就是定时清除整个canvas重新绘制,下面给出“我弹、我弹、我弹弹弹”的代码 (额、名字而已)

      小矩形在矩形区域移动,碰到矩形区域的边缘反弹

itdadao

结语

     历时一天半,本来以为可以玩转的,写下来才发现要玩转canvas还需要很多的实践,这个道理应该是适用所有的技术的,做人啊,就得谦虚点。本文如有错误,请及时留言给我纠正,希望能给正在学canvas绘图的童鞋有所帮助

copyright ? Tim demo下载

Tags:js  

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • Canvas入门-利用Canvas画国旗

    Canvas入门-利用Canvas画国旗

    2016-10-22 12:01

  • Windows 下成功安装node

    Windows 下成功安装node

    2016-09-19 17:04

  • clock 简单canvas实现圆弧时钟

    clock 简单canvas实现圆弧时钟

    2016-09-15 10:01

  • 基于HTML5 Canvas实现雨滴效果: Rainday.js

    基于HTML5 Canvas实现雨滴效果: Rainday.js

    2016-09-13 11:00

网友点评
e