canvas繪製多張圖其中有空白或繪製不成功的問題

一般來說 繪製很多張圖片 中間有幾張沒畫出來 通常就是沒load得原因，具體如下：

let arr = [`img1`,`img2`,`img3`];
let Canvas = document.createElement(`canvas`);
ctx = Canvas.getContext("2d");
let {W, H} = {100, 200};
let scaleBy = 2;
arr.forEach(e => {
    let bgImg = document.creatElement(`img`);
    bgImg.src = e;
    bgImg.onload = () => {
        ctx.drawImage(bgImg, 0, 0, W * scaleBy, H * scaleBy);
        
        let newImg = document.createElement(`img`);
        newImg.src = Canvas.toDataURL();
        document.body.appendChild(newImg);
    }
})