Асинхронность при отрисовки canvas JS

При отрисовки канваса вызываю onload.
Не понимаю как правильно задать промисы в onload. Помогите пожалуйста.

Console: null net::ERR_FILE_NOT_FOUND

Объект Image (асинхронный)

reader.onload @ main.js:428

Объект load (асинхронный)

download @ main.js:384

function download() {
    for(let i=0;i<countFile;i++){
      nowFile = i;
      cx = fileArray[i][1];
      ourfile = fileArray[i][2];
      var commands = fileArray[i][3];
      var reader = new FileReader();
      reader.onload = function(){
          image.onload = function() {
            var color = cx.fillStyle, size = cx.lineWidth;
            ratio = image.height / image.width
            x = image.width;
            y = image.height;
            if(x >= 1300){
              while(x >= 1300){
                x -= (x*1.1-x)
                y -= (y*1.1-y)
              }
            }
            if(y >= 610){
              while(y >= 610){
                x -= (x*1.1-x)
                y -= (y*1.1-y)
              }
            }
            cx.canvas.width = x;
            cx.canvas.height = y;
            cx.drawImage(image, 0, 0, x, y);
            cx.fillStyle = color;
            cx.strokeStyle = color;
            cx.lineWidth = size;
            var fixlineWidth = cx.lineWidth
            var fixstrokeStyle = cx.strokeStyle
            for(let i=0; i<commands.length; i++){
                if(commands[i][0] == 'Line'){
                    cx.lineWidth = commands[i][1];
                    cx.strokeStyle = commands[i][2];
                    cx.lineCap = "round";
                    flagLine = true; 
                    for(let j=0; j<commands[i][3].length-1;j++){
                        cx.beginPath()
                        cx.moveTo(commands[i][3][j][0],commands[i][3][j][1]);
                        cx.lineTo(commands[i][3][j+1][0],commands[i][3][j+1][1]);
                        cx.stroke();
                    }
                  }
                }
            cx.lineWidth = fixlineWidth;
            cx.strokeStyle = fixstrokeStyle;
            console.log(cx.canvas)
              }
          image.src = reader.result;
        };
      reader.readAsDataURL(ourfile);
    }
  }

Ответы (0 шт):