微信小程序制作_js HTML5 canvas绘制图片的方法

js HTML5 canvas绘制图片的方法       这篇文章主要为大家详细介绍了js HTML5 canvas绘制图片的方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

本文实例为大家分享了HTML5 canvas绘制图片的具体代码,供大家参考,具体内容如下

demo.js

window.onload=function() {
 createcanvas();
 drawImage();
 function createcanvas() {
 var CANVAS=document.getElementById('mycanvas');
 context=CANVAS.getContext('2d');
function drawImage() {
 var img=new Image();
 img.onload=function() {
 context.drawImage(img,0,0,200,200 );
 img.src="img5.jpg";
<

 !DOCTYPE html 
 html lang="en" 
 head 
 meta charset="UTF-8" 
 title canvas /title 
 script type="text/javascript" src="demo.js" /script 
 /head 
 body 
 canvas id="mycanvas" width="400" hight="400" 
 span 你的浏览器不支持canvas /span 
 /canvas 
 /body 
 /html 

图片:

效果:

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持凡科。


相关阅读