Javascript kullanarak tuvalden oluşturulan tüm görüntüleri nasıl indiririm?

Question

Tuval üzerine yeni çizimler hazırlıyorum ve özellikle zaman içinde, tuvalin görüntüsünü canvas.toDataURL() ile kaydediyor. Takip

i bir dizideki görüntülerin URL'ler kaydetmek için kullanıyorum kodudur:

var canvas = document.getElementById('myCanvas'); 
var context = canvas.getContext('2d'); 
var images = []; 
function foo(){ 
    /* do my work */; 
    images.push(canvas.toDataURL()); 
    /* clearing canvas to get new image and draw again on canvas */ 
} 

Şimdi işlev foo() adı verilecek defalarca ama bir olaydan sonra, o duracak ve şimdi gerek Tüm görüntüleri bir zip dosyasına sıkıştırmak suretiyle images[]'da saklanan tüm görüntüleri indirin. Bunu yapmak bile mümkün mü?

Answer 1

Bunu JSZip kitaplığı ile yapabilirsiniz. örneğe bakın:

var zip = new JSZip(); 
var img = zip.folder("images"); 
img.file("smile.gif", imgData, {base64: true}); 
var content = zip.generate({type:"blob"}); 
saveAs(content, "example.zip"); 

Sen (dosyaların farklı adları hakkında unutmayın) çoklu görüntüler oluşturmak için döngü içinde img.file() yöntemi kullanmak gerekir.