9
Ho bisogno di caricare un'immagine in modo sincrono, ovvero ho bisogno di sospendere l'esecuzione di javascript fino a quando l'immagine non viene caricata. Poiché image.onload è asincrono, la funzione principale tornerà prima che l'immagine venga caricata.Caricamento immagini in modo sincrono con javascript
Sto usando canvas, e se la funzione principale ritorna prima che l'immagine sia caricata, e quindi disegnata, altre cose nella tela verranno disegnate prima dell'immagine. Questo non funziona perché l'ordine di disegnare su una tela è molto importante!
Ecco quello che ho fatto:
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
C'è un modo per fare questo in modo sincrono, o aspettare fino a quando l'immagine è stata caricata completamente prima di tornare dalla funzione?
Ho un ciclo molto grande che fa molto disegno sulla tela, ed è difficile fare il ciclo di pausa mentre l'immagine si sta caricando, che è quello che mi serve. Se ho usato il callback image.onload, l'immagine sarebbe stata disegnata dopo qualcos'altro nel ciclo. Ciò fa apparire l'immagine davanti alle cose che dovrebbe essere dietro. – devongovett
Nella funzione che avvia il caricamento dell'immagine, come ultima cosa, usa setInterval per avviare una funzione che si chiude su un oggetto che è anche chiuso dal tuo image.onloadback. La funzione "intervallo" non dovrebbe fare nulla fino a quando non è stato impostato un flag specifico. Quella bandiera dovrebbe essere impostata dal tuo image.onloadbackback. Quando trova il flag impostato, la funzione "interval" dovrebbe chiamare il prossimo pezzo di codice; il codice che disegna sopra l'immagine di "sfondo". –
Non * puoi * farla mettere in pausa, devi liberare questa idea dalla tua mente. –