前端手势控制图片插件书写五（添加贴纸功能）

drawSyntheticImg(){
        let keyArr = Object.keys(addPicObj)
        var bgcanvas = document.getElementById(‘canvas1‘);
        var ctx = bgcanvas.getContext(‘2d‘);
        let canvas_outer = document.getElementById(‘canvas_outer1‘);
        let canvasOuter = canvas_outer.getBoundingClientRect();
        ctx.clearRect(0, 0, canvasOuter.width * this.imageQuality, canvasOuter.height * this.imageQuality);
        bgcanvas.height = canvasOuter.height * this.imageQuality;
        bgcanvas.width = canvasOuter.width * this.imageQuality;
        console.warn(addPicObj)

        //ios手机safari不支持async，所以仍然会出现图层被覆盖的情况。
        async function orderDraw(){
            for (let i = 0; i < keyArr.length; i++) {
                let pure_imgSrc = addPicObj[keyArr[i]].pure_img;
                let pure_img = document.createElement(‘img‘);
                pure_img.src = pure_imgSrc;
                function imgLoad(){
                    pure_img.onload = () => {
                        ctx.drawImage(pure_img, 0, 0, bgcanvas.width, bgcanvas.height);
                    }
                }
                await imgLoad()
            }
        }
        orderDraw()
    }