canvas按自己想要的层次关系依次画图片的方法（img.onload()）

来源：互联网发布：linux pdf编辑器编辑：程序博客网时间：2024/05/17 08:47

利用canvas画图片时遇到的问题总结

画图片时会有一个方法

img.src = "图片的路径"img.onload(function(){    pen.drawImage(img,0,0);});

上面这句话的意思是当图片加载完成后再执行函数里面的代码，

那么假如我们要在一个画布里面画很多个图片，而且图片有大有小，我们希望小的图片在大的图片的上面

那么我们应该这样写代码

        //按自己想要的叠加的次序，依次嵌套        //最下面的图片先画        img.src = "图片路径";        img.onload = function(){            pen.drawImage(img,0,0);            //其次画中间的图片            img1.src = "图片路径";            img1.onload = function(){                pen.drawImage(img1,100,0);                //最后画最上面的图片                img2.src = "图片路径";                img2.onload = function(){                    pen.drawImage(img2,200,0);                }            }                   }

这样就按照我们想要的顺序画出来了

0 0