9
Muszę załadować obraz synchronicznie, tj. Muszę wstrzymać wykonywanie javascript do momentu załadowania obrazu. Ponieważ image.onload jest asynchroniczne, główna funkcja powróci przed załadowaniem obrazu.Ładowanie obrazów synchronicznie za pomocą javascript
Używam płótna, a jeśli funkcja główna powróci przed załadowaniem obrazu, a zatem narysowana, inne rzeczy w obszarze roboczym zostaną narysowane przed obrazem. To nie działa, ponieważ kolejność rysowania na płótnie jest bardzo ważna!
Oto co robiłem:
var img = new Image();
img.onload = function() {
//image drawing code here
}
img.src = "blahblahblah";
//function returns here, and other drawing code happens before image is drawn
Czy istnieje sposób, aby to zrobić synchronicznie lub poczekać, aż obraz jest w pełni załadowany przed powrotem z funkcji?
Mam bardzo dużą pętlę wykonującą wiele rysunków na płótnie i trudno jest wstrzymać pętlę podczas wczytywania obrazu, co jest tym, czego potrzebuję. Jeśli użyłem callback'u image.onload, obraz zostanie narysowany po czymś innym w pętli. To powoduje, że obraz pojawia się przed rzeczami, które powinny być z tyłu. – devongovett
W funkcji, która rozpoczyna ładowanie obrazu, jako ostatnia rzecz, użyj setInterval, aby uruchomić funkcję, która zamyka się nad obiektem, który jest również zamknięty przez twój image.onload callback. Funkcja "interwał" powinna nic nie robić, dopóki nie zostanie ustawiona określona flaga. Ta flaga powinna być ustawiona przez twój image.onload callback. Po znalezieniu flagi, funkcja "interwał" powinna wywołać następny fragment kodu; kod, który rysuje się na górze obrazu "tła". –
Nie możesz * przerwać, musisz uwolnić się od tego pomysłu. –