首页 > 语言 > JavaScript > 正文

js+html5绘制图片到canvas的方法

2024-05-06 16:21:29
字体:
来源:转载
供稿:网友

这篇文章主要介绍了js+html5绘制图片到canvas的方法,涉及html5元素操作的相关技巧,需要的朋友可以参考下

本文实例讲述了js+html5绘制图片到canvas的方法。分享给大家供大家参考。具体实现方法如下:

 

 
  1. <!DOCTYPE html> 
  2. <html> 
  3. <body> 
  4. <canvas id="myCanvas" width="200" height="100" 
  5. style="border:1px solid #c3c3c3;"
  6. Your browser does not support the HTML5 canvas tag. 
  7. </canvas> 
  8. <script type="text/javascript"
  9. var c=document.getElementById("myCanvas"); 
  10. var ctx=c.getContext("2d"); 
  11. var img=new Image(); 
  12. img.onload = function(){ 
  13. ctx.drawImage(img,0,0); 
  14. }; 
  15. img.src="img_flwr.png"
  16. </script> 
  17. </body> 
  18. </html> 

希望本文所述对大家的web程序设计有所帮助。

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表

图片精选