Sto scrivendo il gioco Falloutish 2 open-source in PHP + HTML + CSS + JavaScript. In questo momento si occupa del motore. Ho questa gif: https://dl.dropboxusercontent.com/u/4258402/nmwarrgb_e.gifJavascript: GIF animata all'URI dei dati
... che voglio convertire in URI di dati. Ho bisogno di farlo perché i browser nascondono le immagini e questo non è in loop, quindi per essere in grado di "eseguirlo di nuovo" quando l'animazione termina e l'unità va in un'altra tessera, ho bisogno di convertirla in URI di dati. Altrimenti sarei costretto a scaricare nuovamente l'immagine più e più volte, ad es. aggiungendo una stringa casuale alla fine del file immagine. Che funziona bene, ma richiede troppo trasferimento e causa lag.
Questo è il codice ho provato ad utilizzare:
var image = new Image();
(..)
this.convertImageObjectToDataURI = function (image) {
var canvasTemp = document.createElement('canvas');
canvasTemp.width = image.naturalWidth; // or 'width' if you want a special/scaled size
canvasTemp.height = image.naturalHeight; // or 'height' if you want a special/scaled size
canvasTemp.getContext('2d').drawImage(image, 0, 0);
var dataUri = canvasTemp.toDataURL('image/gif');
// Modify Data URI beginning
dataUri = "data:image/gif;" + dataUri.substring(15);
console.log(dataUri);
// Return image as Data URI
return dataUri;
};
Purtroppo produce URI dati solo per il primo fotogramma. Ho provato a cercare i plug-in, a leggere su tela HTML, ma sono ancora Non so come convertire il GIF animato nell'URI dei dati. Qualsiasi aiuto sarebbe molto, molto benvenuto!
La gif animata è un'animazione nella tela? Penso che non animare. Questo è il tuo problema. Hai bisogno di convertirlo dinamicamente? Ho detto, se vuoi inserire il codice base64 in una variabile senza caricare le immagini sul tuo server, puoi codificarlo con uno strumento online e non è necessario codificarlo mentre il gioco è in esecuzione. –
Il problema è che ci sono circa 20 000 animazioni gif: -) E la preoccupazione per me è di forzare questa gif a ricominciare tutto da capo, dopo aver finito di giocare per la prima volta. Ah, probabilmente avrò bisogno di attenermi a più richieste con una stringa casuale attaccata alla fine per ingannare il browser. – Rav
OMG, quindi la mia risposta sugli sprites è scartata credo. Ma devi sapere che gli sprite sono la tecnica più utilizzata per le animazioni nei giochi. In bocca al lupo ! –