Warten bis image geladen ist

[mike64]

Danke für die Ausführungen

leider komme ich nicht weiter

1) Die Abfrage per Schleife scheitert daran, daß ich mich immer in eine Endlosschleife begebe, was den Browser zum Absturz bringt. Das Ereignis tritt nie ein. Ich vermute, der Interpreter führt da keine weiteren Arbeiten aus, sodaß die Variable irgendwann mal geändert wird und die Schleife verlassen wird.
Weder mit complete, noch mit flags.

2) Der Versuch mit await scheitert auch.
Ich habe es so verstanden, daß await hier wirklich wartet, muß aber feststellen, daß mein Hauptprogramm weiter läuft. Gemäß dem Beispiel habe ich meine Prozeduren mit await geschrieben und sehe in der Konsole zahlreiche Bildanforderungen und irgendwann kommt dann mal die ein oder andere "Geladen" Meldung. Somit wartet das Programm hier nicht sondern arbeitet weiter. Nur die Async Funktion wartet. Dann wäre das nur eine andere Programmierung bei sonst gleicher Problematik. Ich benötige ein echtes Stop und bekomme es nicht hin.

Code:

function loadImage (path)
{
  console.log ('bild'+path);
    return new Promise((resolve, reject) => {
    const img = new Image();
    img.crossOrigin = 'Anonymous'; // to avoid CORS if used with Canvas
    img.src = path;
    img.onload = () => {
      resolve(img)
    }
    img.onerror = e => {
      reject(e)
    }
  })
}

async function loadImg (img_url)
{
  console.log ('Image anfordern');
  img = await loadImage(img_url);
  console.log ('Image geladen');
  console.log (img);
  return img;
}