canvas教程

请高手解答canvas画图问题

字号+ 作者:H5之家 来源:H5之家 2015-09-30 15:00 我要评论( )

代码: 1 head 2 /head 3 body 4 canvas width=300 height=300/canvasbrbr 5 script 6 var img= new Image(100,100); 7 img.src="1.jpg"; 8 var g =document.getElementById("c").getContext("2d"); 9 g.drawImage(img, 0, 0); 10 document.body.appendChild

代码:

  1 <head>
  2 </head>
  3 <body>
  4 <canvas width=300 height=300></canvas><br><br>
  5 <script>
  6     var img= new Image(100,100);
  7     img.src="1.jpg";
  8     var g =document.getElementById("c").getContext("2d");
  9     g.drawImage(img, 0, 0);
 10     document.body.appendChild(img);
 11 </script>
 12 </body>

结果:

采用document.body.appendChild画出的图像大小是100*100,但是canvas画出来的是图像本身图像,难道canvas不知道我已经改变了图像大小?

 

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

相关文章
  • html5canvas核心技术图形、动画与游戏开发源码

    html5canvas核心技术图形、动画与游戏开发源码

    2017-05-02 17:42

  • 打印html5中Canvas的方法

    打印html5中Canvas的方法

    2017-05-01 15:03

  • HTML5+Canvas调用手机拍照功能实现图片上传(下)

    HTML5+Canvas调用手机拍照功能实现图片上传(下)

    2017-04-30 17:00

  • 学习慕课网canvas倒计时实例笔记

    学习慕课网canvas倒计时实例笔记

    2017-04-30 14:01

网友点评
n